1

ファイルアップロードシステムを作成しようとしています。このファイルアップロードシステムは、mosot部分に最適です。問題が発生するのは、ページにクラスfileを持つ複数のHTML要素と、である複数のHTML要素があるためですupload-buttons。現在、ファイルのアップロードは、アップロードテキストフィールドとアップロードボタンのみを含む最初のHTML要素に対してのみ機能し、他のすべての要素は機能しません(Javascriptが毎回[0]オブジェクトを選択するため)。

私の質問は、使用されたアップロードコンテナ/ボタンに対応するために、以下の機能をどのように調整できますか?

基本的に、ユーザーがn番目のアップロードボタンをクリックした場合、関数配列スロットは何らかの形でn-1に等しくなる必要があります。

この問題についての支援に感謝します。

よろしくお願いします!

$(document).on('click','.upload-button', function(){
        var data = new FormData();

        jQuery.each($('.file')[0].files, function(i, file) {
            data.append('file-'+i, file);
        });
            //Some more code...
});

HTML

     <div class="input-text-field">
         <input name="userfile" class="file" type="file" />
         <input class="submit upload-button" type="submit" value="Upload" />
     </div>
4

1 に答える 1

3

prev()前の要素のみをターゲットにするために使用し.fileます。コードには.file要素がなく、#file要素があり、複数のIDが無効であることに注意してください。

$(document).on('click','.upload-button', function(){
        var data = new FormData();

        jQuery.each($(this).prev('.file')[0].files, function(i, file) {
            data.append('file-'+i, file);
        });
            //Some more code...
});

html

<div class="input-text-field">
     <input name="userfile" class="file" type="file" />
     <input class="submit upload-button" type="submit" value="Upload" />
 </div>
于 2013-03-13T23:03:49.873 に答える