Question

我正在尝试为尚未退出的项添加事件侦听器。我将动态添加项目，但我希望它们在添加到DOM时具有事件监听器。我使用了.on（）函数，但这仅适用于加载时页面上的项目，而不适用于动态添加的项目。以下是我的代码：

$(document).ready(function () {
    var $add_button = $('#add-item')
    var newItem;
    var $incompleteTasks = $('#incomplete-tasks');

    $('button.check').on("click", function () {

        alert('Helloww');
    });

    $add_button.click(function () {

        newItem = $('#new-task').val();

        //create li element and assign it to variable
        var li = $('<li></li>');
        var label = $('<label></label>');
        var button = $('<button class="check">Check</button>');

        //Use input value as the text for li item
        label.text(newItem);


        //append new item to incomplete tasks ul

        $incompleteTasks.append(li);
        li.append(label);
        li.append(button);

    });

});

我不确定我在哪里出错了。

感谢您的帮助。

Answer 1

您可以为此目的使用delegate（）或on（）

请参阅delegate和on

注意：从jQuery 1.7开始，.delegate（）已被.on（）方法取代

在您的情况下，您不会就父母提供选择

$("parent_selection").on('click', 'actual_element' ,function(){});

例如使用此

$('#incomplete-tasks').on("click",'.check',function(){

alert('Helloww'); 
});

将事件侦听器添加到页面上不存在的项目

1 个答案: