javascript - 无法按类别选择列表对象

标签 javascript jquery jquery-mobile

我的 jQuery 有点生疏,因此这个菜鸟问题:

我有这个无序列表,

 <ul data-role="listview" id="list-all-forms">
 </ul>

我从 JSON 对象填充:

function updateChecklists(){
    requestAllForms = $.get("/list-all-forms");

    requestAllForms.promise().done(function(data){
        $.each(data,function(key, val){
            $("<li><a class='checklistObject' id='" + val.id +"'>" + val.name +"</a></li>").appendTo("#list-all-forms");
        });
        $('ul').listview('refresh');
    });
};

但是,当我尝试从列表中包含 checklistObject 类的链接获取单击事件时,没有任何反应...

$(".checklistObject").on("click", function(){
    console.log("click on list object!");

});

我怎样才能触发该功能?

最佳答案

根据您创建事件处理程序的时间,这些对象可能存在也可能不存在,因此事件未正确附加。您可以等到它们创建后添加该事件处理程序,或者使用事件委托(delegate)并将代码更改为如下所示:

$('#list-all-forms').on('click', '.checkListObject', function() {
    console.log($(this), "click on list object");
});

这将在您的项目添加到 DOM 之前和之后起作用。

或者正如评论中提到的,像这样:Event binding on dynamically created elements?

关于javascript - 无法按类别选择列表对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26109206/

相关文章:

javascript - 访问 Controller 中的 ng-repeat 变量

javascript - 获取 html5 select 中所选选项的键(文本)

javascript - 如何捕获 ALT+C 按键

javascript - 在 jquery mobile 中离开页面时结束 SetInterval 函数

android - jQuery 移动按钮按下事件处理缓慢

javascript - 如何获取 ui-router 状态参数?

javascript - 自定义 Dojo DateTextBox - 只需要 mm/yy 输入

javascript - 在 jQuery 中弹出预先挂起的 div 项目(在消息接收时)

javascript - 在 smarty 或 javascript/jQuery 中匹配特定单词后 chop 字符串

javascript - 仅使用部分 jQuery Mobile