ThinkPHP は、uploadiveve を統合してファイルのアップロードを実装します

Thinkphp整合uploadifive进行动态参数传递，内容列表按钮实现一键上传文件
兜兜转转又回到TP了。。有大几年都在用CI写项目，最近回到TP来，项目中有一个功能花了点时间，特分享出来。
就是，后台内容列表里每一条记录都放一个按钮，可以快速进行文件上传（不需要点击编辑进入详情再上传），就想到了以前用过的uploadify，但由于办公室多数同事都用MAC，则uploadifive更合适。
废话不多说，上代码：
第一步，加载jquery.js/uploadifive.js/uploadifive.css
第二步，构建HTML列表：<table> <br> <tr> <td>商品名称1</td> <td><input></td> </tr> <br> <tr> <td>商品名称2</td> <td><input></td> </tr> <br> </table> <br> <div></div>注: このコードはバックエンド製品リストを模倣しており、実際のテンプレートはループである必要があります。各行にはファイルのアップロード ボタンが表示されます。1 つのページに複数のアップロードがあるため、クラス名 .uploadifive が使用されます (ID 名は使用できません)。コンテンツ ID は後で使用できるようにファイル コントロールに書き込まれます。
3 番目のステップは、テンプレートに JS コードを記述することです:
<script>$(function(){<code class="prettyprint linenums lang-php">) $('.uploadive').uploadive({<br /> 'auto' : true, //自動的にアップロードします<br /> 'width' : '80px', //ボタンの幅<br />                                                                                                                                                                                                                                                               ‘uploadScript’ : ‘/Index/uploadifive’, //アップロードメソッド<br /> ‘fileObjName’ : ‘mp3’,<br /> ‘buttonText’ : ‘アップロード’,<br /> 'queueID' : 'process', //キューのIDを表示します<br /> ‘fileType’ : ‘*.mp3’,<br /> 「マルチ」: false、<br /> 'fileSizeLimit' : '5MB',<br /> 'アップロード制限' : 1,<br /> 'removeTimeout' : 0,<br /> 'キューサイズ制限' : 1,<br /> 'removeCompleted' : true, //アップロード完了後にリストを自動的に非表示にします<br />                                                                                                                           'onAddQueueItem': function(file){<br /> This.data('uploadifive').settings.formData = {'id':$(this).data('id')} //動的パラメータメソッドを渡す<br />; }、<br /> 'onUploadComplete' : function(file, data){<br /> var obj = JSON.parse(data);<br /> If (obj.status == '成功'){<br /> Layer.msg('アップロード成功!',{icon:1,time:1500},function(){<br /> window.location.reload();<br /> });<br /> - "それ以外 Layer.msg("アップロードに失敗しました!",{icon:2});<br /> }<br /> }、<br /> onCancel: 関数(ファイル){<br /> $データ 設定 = $data.settings;<br /> settings.uploadLimit++;<br /> layer.msg(file.name + "アップロードがキャンセルされました~",{icon:2});<br /> }、<br /> });<br /> });<br /></script>説明: このコードがキーポイントです。コンテンツ ID の取得に時間がかかり、すべての国産素材がパラメータを動的に転送できないことがわかり、最終的にはすべてごちゃごちゃになりました。 Google は 1 分以内にそれを解決しました。uploadifive で動的に渡されるパラメーターは、jquery 構文を使用して onAddQueueItem で定義でき、複数のパラメーターを定義できます。

ステップ 4: コントローラーで Uploadifive メソッドを作成します。アップロード コードは、ローカル、サーバー、またはクラウド ストレージにアップロードするのに非常に便利です。テンプレートJSの。実際のプロジェクトでは実装ロジックが異なるため、ここでのコードは掲載しません。ご自身で作成してください。

ステップ 5: もうダメです~

概要: 1. このルーチンは、uploadifive HTML5 アップロード プラグインを使用します。このバージョンは、著作権の問題のため、公開しません。見つからない場合は、私にプライベート プラグインを送ってください。メッセージを送ってメールで送信してください。 2. このルーチンは自動アップロードを使用するため、コンテンツ ID を取得することが重要です。手動アップロードの場合はより簡単です。 3. この例では、レイヤー プラグインも使用します。必要な場合は、それをダウンロードしてヘッダーにロードする必要があります。 さて、この記事の主なポイントは、uploadifive のパラメータの動的送信であることは認めますが、私と同じ問題に遭遇した人が、寄り道や時間の無駄を避けるためにこの記事を見つけられることを願っています。ご質問がある場合は、メッセージを残してください。注意してみます〜〜