JavaScriptで添付ファイルのプレビュー機能を実装するコードの紹介

この記事では、JavaScript での添付ファイルのプレビュー機能の実装を主に紹介します。具体的な操作手順は以下で詳しく説明します。興味のある方は参照してください。

同社の EMP イメージング プラットフォームは比較的扱いにくく、プレビューする前にダウンロードする必要があるため、業務スタッフは添付ファイル リスト ページにプレビュー ページを追加することを提案しました。今日は完了したプロセスを記録します:

1 つは js バージョン、もう 1 つは jquery バージョンです。 ここでは js バージョンが使用されています。 jquery バージョンの導入方法が少し異なるだけです。

1. プラグインを導入します（アップロード済み）

95f58c7bd49d13940525534480183e84db271416853c42fd247a57c1a2c29eb6

5a1abd745f0061c9a46e802a4aa9584b 写真をプレビューするときに、複数の写真、または未選択の写真を選択できます。選択しない場合、デフォルトでこのリスト内のすべての写真が表示されます。チェックすると、選択した写真が表示されます。 . ここで、APP が多くの画像の圧縮パッケージをアップロードしていることがわかりました。そのため、*.zip と *.rar を自動的に解凍する機能が追加されました。この部分には、1.6 のみをサポートするサードパーティの jar パッケージの導入が必要です。 *.zip 形式の解凍、および最も恥ずかしい Sun 社のデフォルトのエンコーディング、中国語がある場合、エラーが報告され、jdk1.7 まで中国語はサポートされません

import java.io.*; .util.ArrayList;import java.util.Enumeration;import java.util.List;

import org.apache .tools.zip.ZipEntry;

import org.apache.tools.zip.ZipFile;
import com.yucheng .cmis.operation.CMISOperation;

import com.github.junrar.Archive;

import com.github.junrar.rarfile .FileHeader;

3. 解凍されたファイルの非同期削除



共有ディスクのスペースを占有しているため、解凍後に非同期削除が行われます。時間は 20 秒後です。十分な時間ですが、20 秒を超えると、画像へのパスが変更されているため、画像の読み込みに失敗します。期限切れ。

<SCRIPT>
var attach_path= &#39;${param.attach_path}&#39;;
var attach_name= decodeURI(&#39;${param.attach_name}&#39;);
var attachPath= new Array();
attachName=attach_name.split(",");
var attachPath1= new Array();
attachPath1=attach_path.split(",");
for (var i=0;i<attachPath1.length;i++)
{ 
 attachPath2=&#39;102storage&#39;+attachPath1[i];
 $("#jq22").append("<li><img alt=&#39;"+attachName[i]+"&#39; src=&#39;"+attachPath2+"&#39;></li>"); 
}
$(function() {
 $(&#39;#jq22&#39;).viewer({
  url: &#39;src&#39;,
 });
});
</SCRIPT>

4. ディスクのマウント

画像を表示する場合、ページはプロジェクトが考える画像パスにアクセスできないため、mount コマンドを実行して、共有ディスクのパスをマウントする必要があります。プロジェクトを特定のパス

mount --bind /testshare01 /app/cmis/project/cmis.war/ff/testshare01

こうすれば正常に表示できます

以上がJavaScriptで添付ファイルのプレビュー機能を実装するコードの紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。