0

ユーザーがファイルを追加するときに、jQuery を使用して追加のファイル アップロード ボタンを追加する機能があります。私の問題は、適切な形式で追加したり、毎回追加したりすることができないように見えることです。私の現在の関数は、文字列を直接追加しようとするだけです:

jQuery(document).ready(function($) {
    $(function() {
        $("input:file").change(function(){
            $("input:file").after("</td></tr><tr><td class=\"field_name span4\"><strong></strong></td><td class=\"field_option\"><input type=\"file\" name=\"pictures\">");
        });
    });
});

これのライブバージョンはこちらで見ることができます: http://1ro.co/salem/?module=insert

上記の方法の問題点は、最初の 2 つの終了タグを追加しないことです: </td></tr>.

$("input:file"); を設定するなどの方法を試しました。ただし、最初の値以降のすべての値に対して設定されるわけではありません。例えば：

var count = 0;

jQuery(document).ready(function($) {
    $(function() {
        var input = $("input:file");
        input.change(function(){
            input.after(input.get(count++));
        });
    });
});

ただし、これはまったく追加されません (理論的には、おそらくすべての要素が追加されます)。input.get(count) で .after() を使用することはできません。

簡単に言えば、これを改善して、新しいファイルのアップロード ボタンを追加し、不適切にフォーマットされないようにすることを目指しています。可能であれば、方法2を使用したいのですが、現時点ではそれが機能することを望んでいます.

4

2 に答える 2

1

新しいファイル入力ごとにハンドラーを再度追加する必要があるため、関数でそれを分離することをお勧めします。

var addfile = function() {
  var newRow = $("<tr><td class=\"field_name span4\"><strong></strong></td>" +
      "<td class=\"field_option\"><input type=\"file\" name=\"pictures\">").
    insertAfter($(this).closest('tr'));

  newRow.find('input:file').change(addfile);
};

$("input:file").change( addfile );
于 2013-09-27T20:17:40.623 に答える
0

ライブデモを試してみたところ、何かが挿入されています。ただし、イベントハンドラーは最初のオブジェクトにのみバインドされるため、もちろん一度しか発生しません。

次のようなものを使用して、変更機能を試してみます。

$('input:file').change(function() {
    $(this).closest('tr').after($(this).closest('tr').clone());
});

ただし、変更ハンドラも再構築する必要があります。

于 2013-09-27T20:25:21.990 に答える