Question

在我的表单中，有一个按钮可以根据用户的需要添加其他元素。对于每个输入字段，都有一个.change（）处理程序。问题是.change不会触发附加的表单元素，但仍会触发现有的表单元素。任何帮助表示赞赏。

$('.element').each(function() {
$mainElement = $(this); // memorize $(this)
$sibling = $mainElement.next('input'); // find a sibling to $this.
$sibling.change(function($mainElement) {
    return function() {
        $mainElement.text('My textfield changed');
    }
}($mainElement));

Jsfiddle演示：$geoNear

Answer 1

尝试on方法：

$(document).on('change', 'input', function() {});
//or
$(document).on('change', '.inputclass', function() {});

它将事件与文档一起注册，它甚至可以用于新添加的文档。您的更改事件已在现有元素中注册。

Answer 2

为了简单起见，我复制粘贴代码。

单击“添加”按钮，您不会再次为新创建的元素绑定更改事件。单击时执行此操作：

$('#test').click(function(){
$('ul').append('<li><p class="element">Lorem ipsum</p><input/></li>');
$('.element').each(function() {
    $mainElement = $(this); // memorize $(this)
    $sibling = $mainElement.next('input'); // find a sibling to $this.
    $sibling.change(function($mainElement) {
        return function() {
            $mainElement.text('My textfield changed');
        }
    }($mainElement));
});
});

事件未在附加元素的输入更改时触发

2 个答案: