画像アップロードプラグイン jquery.uploadify_javascript スキルの詳細説明

1. js コード:

コードをコピーします コードは次のとおりです $(document).ready(function() { $('#fileInput').uploadify( { //次のパラメータはオプションです 'uploader' : ' images/uploadify.swf', //アップロード コントロールのメイン ファイルを指定します。デフォルトは 'uploader .swf' 'script' : ' UploadServlet', //サーバー側のアップロード処理ファイルを指定します。デフォルトは 'upload.php' 'cancelImg' : '&lt ;%=basePath%>images/cancel .png', //アップロードされた画像をキャンセルするように指定します。デフォルトは 'cancel.png' 'buttonImg':' images/upload2 .jpg', 'auto' : true, //ファイルを選択した後に自動的にアップロードするかどうか、デフォルトは false 'folder' : '/userphoto' , //アップロード先のサーバーのパス、デフォルトは '/' です。 'multi' : false, //複数のファイルを同時にアップロードできるかどうか、デフォルトは false 'fileDesc' : 'Picture file', //ファイルの種類の説明アップロード ダイアログ ボックスに表示されます。 'fileExt' : '*.jpg;*.bmp;*.png ;*.gif', //このオプションを有効にする場合は、fileDesc も宣言する必要があります。 'sizeLimit': 86400, //アップロードされたファイルのサイズをバイト単位で制御します 'onComplete': function(event,queueID,fileObj,response,data) { $('#image'). attr("src","userphoto/" 応答); $( '#image').show(); $('#photo').attr(" value",response); }, 'onError' : function(event, queueID, fileObj) { alert("File: " fileObj.name " アップロードに失敗しました"); } }) });

2. > (1) ページに「BROWSE」ボタンが表示されない場合は、「uploader」:「 images/uploadify.swf」の設定が間違っているかどうかを確認してください。は正しいです。 (2) ボタン画像を変更する必要がある場合: 'buttonImg' 設定を使用して置き換えることができます (3) アップロードが完了した後、「onComplete」イベントはトリガーされません。バックグラウンド サーブレットが処理された後、ページに 1 を出力する必要があります。そうしないと、ページの onComplete コールバック関数は実行されません。応答.getWriter().write(1); (4)。バックグラウンド サーブレットがアップロードを処理するときにイメージの名前が変更された場合、その値は fileObj を通じて取得できません。代わりに、新しいファイル名をバックグラウンド サーブレットによって出力する必要があります: out.print(filename)。 ); jsp ページ上で応答を使用して新しい値を取得します。

(5)、画像プレビューの実装:

JSP ページに を追加し、アップロードが完了したら、onComplete イベントの img の src 値を変更します。

3. ダウンロードアドレス

http://www.uploadify.com/download/