appendTo 对象不会对 jquery 更改采取行动答案

【问题标题】：appendTo objects wont take action on jquery changeappendTo 对象不会对 jquery 更改采取行动
【发布时间】：2012-05-06 23:00:10
【问题描述】：

我有输入更改功能，它适用于已经存在的第一个输入，但是当 jscript 添加另一个时
带appendTo的输入对象，同样的功能不起作用...

$("input[type=file]").change(function() {
$('<input name="fails[]" type="file" />').appendTo('#input_lauki');
$('<a href="#" onclick="dzest(this);return false" class="link" name="dzest" style="font-weight:normal; display:inline;">Izdzēst</a><br/>').appendTo('#input_lauki')
$('.link').css('display','inline');

});

谢谢！

【问题讨论】：

标签： javascript jquery input appendto

【解决方案1】：

你可以试试

$('input[type=file]').on('change',function(){

 //your code


});

【讨论】：

live 在较新的 jquery 版本上已弃用。你应该改用on()

【解决方案2】：

当您定义更改事件处理程序时，您有一定数量的输入文件，因此您稍后插入的新输入没有为该事件定义处理程序。

您应该将事件捕获到父 #input_lauki

$("#input_lauki").on('change', 'input[type=file]', function() {
 ...
}

小提琴示例：http://jsfiddle.net/TwWEt/

【讨论】：

【解决方案3】：

您还需要使用$.on 来绑定添加到 DOM 的新元素：

$.on("change", "input[type=file]", function() {
    $('<input name="fails[]" type="file" />').appendTo('#input_lauki');
    $('<a href="#" onclick="dzest(this);return false" class="link" name="dzest" style="font-weight:normal; display:inline;">Izdzēst</a><br/>').appendTo('#input_lauki')
    $('.link').css('display','inline');

});

或live，如果您使用的是旧版本的 jQuery，因为它有一些特殊处理，您应该在文档中阅读。

【讨论】：

$.on 需要应用于选定的元素：示例应为 $('#input_lauki').on('change', 'input[type=file]'