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

上面显示的方法的问题是它没有添加前两个结束标签：</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

You'll need to re-add the handler to each new file input, so best to isolate that in a function:

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 回答