JQueryアップロードプラグインUploadifyの詳細とその中国語ボタンソリューション
4543 ワード
ネット上で1日探して、みんなはすべてUploadifyの唯一の欠点が中国語のボタンを支持しないと言って、杯具の前に、私はUploadifyのAPIを見て、やっといくつかのパラメータがみんなに言及されていないことを発見して、これはまさにこの問題を解決する鍵です.(これからは断固としてAPIを見る習慣を身につけます)
UploadifyにはbuttonTextというパラメータがあります.これはどのように変更しても中国語をサポートしません.プラグインはjsでこのパラメータの値をトランスコードする方法を使っています.復号された場所はそのswfファイルにあり、コードが見えないので、この道はだめです.
もう一つのパラメータは、ネット上ではあまり言及されていませんが、buttonImg(ボタン画像)です.このとき、プラグインが持っている黒いflash閲覧ボタンを1つの画像で置き換えることができます.自分の画像が中国語であれば、中国語のボタンの問題を解決するのではないでしょうか.これだけ追加すると、ボタンの画像の下に白い領域があります.実はそのflashが残っています.白い領域はマウスの使用可能な範囲を示しています.この範囲はwidth、heightで調整できます.もう一つのパラメータwmodeのデフォルト値はopaqueで、transparentに変更すればいいです.つまり、その白い領域を透明化します.先ほどお話しした方法で、ボタンのクリック範囲をあなたの画像と同じ大きさに設定すれば完全にOKです.
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
Uploadifyの使い方はもちろん、ネット上の文章が多く、他のjqueryプラグインの使い方と同じように、いくつかのファイルの配置経路にすぎません.
以下にUploadifyの一部のパラメータの紹介を添付し、すべてを見るにはAPIファイルを見に行きます.一般的にダウンロードしたパッケージにあります.
uploader : uploadify.swfファイルの相対パス、このswfファイルは1つの文字BROWSEのボタンがあるので、クリックした後に弾いてファイルのダイアログボックスを開けて、デフォルト値:uploadify.swf.
script:バックグラウンドプロセッサの相対パス.デフォルト:uploadify.php
checkScript:アップロードされたファイルがサーバに存在するかどうかを判断するバックグラウンドプロセッサの相対パス
FileDataName:サーバハンドラでファイルをアップロードするデータを取得する名前を設定します.デフォルトはFiledata
method:コミット方式PostまたはGetデフォルトはPost
scriptAccess:flashスクリプトファイルのアクセスモード、ローカルテストでalwaysに設定されている場合、デフォルト:sameDomain
folder:ファイルが格納されているディレクトリをアップロードします.
QueueID:ファイルキューを格納するdivのIDと一致するファイルキューのID.
QueueSizeLimit:多くのファイルの生成が許可されている場合、選択ファイルの数を設定します.デフォルト:999.
Multi:trueに設定すると、複数のファイルをアップロードできます.
Auto:trueに設定ファイルを選択すると直接アップロードされ、falseのためにアップロードボタンをクリックしてアップロードする必要があります.
file Desc:この属性値はfile Ext属性を設定してから有効でなければなりません.ファイル選択ダイアログボックスのプロンプトテキストを設定します.file Descを「rar doc pdfファイルを選択してください」に設定し、ファイル選択ボックスを開くと次の図のように効果があります.
FileExt:選択可能なファイルのタイプを設定します.フォーマットは'*.doc;*.pdf;*.rar'.
sizeLimit:アップロードファイルのサイズ制限.
simUploadLimit:同時アップロードを許可する個数のデフォルト値:1.
buttonText:ブラウズボタンのテキスト、デフォルト:BROWSE.
buttonImg:ブラウズボタンの画像のパス.
hideButton:trueに設定するとブラウズボタンの画像が非表示になります.
rollover:trueとfalseの値で、trueに設定すると、マウスをブラウズボタンに移動すると反転します.
width:ブラウズボタンの幅を設定し、デフォルト:110.
height:ブラウズボタンの高さを設定し、デフォルト:30.
wmode:transparentとして設定すると、ブラウズボタンのflashバックグラウンドファイルが透明になり、flashファイルがページの最上位に配置されます.デフォルト:opaque.
cancelImg:ファイルキューにファイルを選択した後の各ファイルの閉じるボタンアイコン
Uploadifyはまた多くのパラメータと有用な方法とコールバック関数を持っていて、すべてAPIの中で、全英語ですが、分かりやすくて、ここでは言いません.
以下は私が使ったコードです.参考にしてください.
注意しなければならないのは、scriptプロパティ値がリクエストパスであり、複数のファイルを同時にアップロードするように設定した後(例えば3)、リクエストごとに3つのファイルをアップロードするのではなく、3回のリクエストを実行し、1回に1つのファイルをアップロードするように要求していることです.これも仕方がありません.uplodifyにはそんなに多くのコールバック関数があります.一度に複数を処理すると、コールバック関数のパラメータはどれを取るか分かりません.これらのパラメータは配列ではありませんから.
つまり、いくつかのファイルを同時にアップロードするように設定しても、1つずつリクエストしてアップロードしますが、表面的には複数のスレッドが同時にアップロードリクエストを処理しているように感じられますが、表象にすぎません.またsimUploadLimitを大きく設定するとよくエラーが発生し、5に設定すると1、2つのファイルのアップロードに失敗することがよくあります.
UploadifyにはbuttonTextというパラメータがあります.これはどのように変更しても中国語をサポートしません.プラグインはjsでこのパラメータの値をトランスコードする方法を使っています.復号された場所はそのswfファイルにあり、コードが見えないので、この道はだめです.
もう一つのパラメータは、ネット上ではあまり言及されていませんが、buttonImg(ボタン画像)です.このとき、プラグインが持っている黒いflash閲覧ボタンを1つの画像で置き換えることができます.自分の画像が中国語であれば、中国語のボタンの問題を解決するのではないでしょうか.これだけ追加すると、ボタンの画像の下に白い領域があります.実はそのflashが残っています.白い領域はマウスの使用可能な範囲を示しています.この範囲はwidth、heightで調整できます.もう一つのパラメータwmodeのデフォルト値はopaqueで、transparentに変更すればいいです.つまり、その白い領域を透明化します.先ほどお話しした方法で、ボタンのクリック範囲をあなたの画像と同じ大きさに設定すれば完全にOKです.
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
Uploadifyの使い方はもちろん、ネット上の文章が多く、他のjqueryプラグインの使い方と同じように、いくつかのファイルの配置経路にすぎません.
以下にUploadifyの一部のパラメータの紹介を添付し、すべてを見るにはAPIファイルを見に行きます.一般的にダウンロードしたパッケージにあります.
uploader : uploadify.swfファイルの相対パス、このswfファイルは1つの文字BROWSEのボタンがあるので、クリックした後に弾いてファイルのダイアログボックスを開けて、デフォルト値:uploadify.swf.
script:バックグラウンドプロセッサの相対パス.デフォルト:uploadify.php
checkScript:アップロードされたファイルがサーバに存在するかどうかを判断するバックグラウンドプロセッサの相対パス
FileDataName:サーバハンドラでファイルをアップロードするデータを取得する名前を設定します.デフォルトはFiledata
method:コミット方式PostまたはGetデフォルトはPost
scriptAccess:flashスクリプトファイルのアクセスモード、ローカルテストでalwaysに設定されている場合、デフォルト:sameDomain
folder:ファイルが格納されているディレクトリをアップロードします.
QueueID:ファイルキューを格納するdivのIDと一致するファイルキューのID.
QueueSizeLimit:多くのファイルの生成が許可されている場合、選択ファイルの数を設定します.デフォルト:999.
Multi:trueに設定すると、複数のファイルをアップロードできます.
Auto:trueに設定ファイルを選択すると直接アップロードされ、falseのためにアップロードボタンをクリックしてアップロードする必要があります.
file Desc:この属性値はfile Ext属性を設定してから有効でなければなりません.ファイル選択ダイアログボックスのプロンプトテキストを設定します.file Descを「rar doc pdfファイルを選択してください」に設定し、ファイル選択ボックスを開くと次の図のように効果があります.
FileExt:選択可能なファイルのタイプを設定します.フォーマットは'*.doc;*.pdf;*.rar'.
sizeLimit:アップロードファイルのサイズ制限.
simUploadLimit:同時アップロードを許可する個数のデフォルト値:1.
buttonText:ブラウズボタンのテキスト、デフォルト:BROWSE.
buttonImg:ブラウズボタンの画像のパス.
hideButton:trueに設定するとブラウズボタンの画像が非表示になります.
rollover:trueとfalseの値で、trueに設定すると、マウスをブラウズボタンに移動すると反転します.
width:ブラウズボタンの幅を設定し、デフォルト:110.
height:ブラウズボタンの高さを設定し、デフォルト:30.
wmode:transparentとして設定すると、ブラウズボタンのflashバックグラウンドファイルが透明になり、flashファイルがページの最上位に配置されます.デフォルト:opaque.
cancelImg:ファイルキューにファイルを選択した後の各ファイルの閉じるボタンアイコン
Uploadifyはまた多くのパラメータと有用な方法とコールバック関数を持っていて、すべてAPIの中で、全英語ですが、分かりやすくて、ここでは言いません.
以下は私が使ったコードです.参考にしてください.
[javascript] view plaincopyprint?
1.<script type="text/javascript">
2.$(document).ready(function() {
3. $("#uploadify").uploadify({
4. 'uploader' : 'images/uploadify.swf',
5. 'script' : '<%=request.getContextPath()%>/content/ImportScheduleCommitAction.do',
6. 'cancelImg' : 'images/cancel.png',
7. 'folder' : '/',
8. 'queueID' : 'fileQueue',
9. 'fileDataName' : 'uploadify',
10. 'fileDesc' : ' :xls.',
11. 'fileExt' : '*.xls',
12. 'auto' : false,
13. 'multi' : true,
14. 'height' : 20,
15. 'width' : 50,
16. 'simUploadLimit' : 3,
17. //'buttonText' : 'fdsfdsf...',
18. 'buttonImg' : 'images/browse.jpg',
19. // 'hideButton' : true,
20. // 'rollover' : true,
21. 'wmode' : 'transparent' ,
22. onComplete : function (event, queueID, fileObj, response, data)
23. {
24. $('<li></li>').appendTo('.files').text(response);
25. },
26. onError : function(event, queueID, fileObj)
27. {
28. alert(" :" + fileObj.name + " ");
29. }
30. // onCancel : function(event, queueID, fileObj)
31. // {
32. // alert(" ：" + fileObj.name);
33. // }
34. }); 注意しなければならないのは、scriptプロパティ値がリクエストパスであり、複数のファイルを同時にアップロードするように設定した後(例えば3)、リクエストごとに3つのファイルをアップロードするのではなく、3回のリクエストを実行し、1回に1つのファイルをアップロードするように要求していることです.これも仕方がありません.uplodifyにはそんなに多くのコールバック関数があります.一度に複数を処理すると、コールバック関数のパラメータはどれを取るか分かりません.これらのパラメータは配列ではありませんから.
つまり、いくつかのファイルを同時にアップロードするように設定しても、1つずつリクエストしてアップロードしますが、表面的には複数のスレッドが同時にアップロードリクエストを処理しているように感じられますが、表象にすぎません.またsimUploadLimitを大きく設定するとよくエラーが発生し、5に設定すると1、2つのファイルのアップロードに失敗することがよくあります.