javascript - 如何为每个元素添加点击事件监听器?

标签 javascript jquery

我使用查询来构建移动应用程序。首先,我使用 $.getJSON 从 json 文件中检索数据:

$.getJSON('js/sura.json', function(data){
        $.each(data, function(key, value){
            //alert(key+' '+value['id']);
            buildList(value['id'], value['name'], value['number']);
        });
    });

json 文件中有超过 100 行。

之后,我需要将每个列表放入元素名称 <ul id="list></ul> 。我应该创建新的 Javascript 函数然后编写代码吗:

function buildList(id, name, number){

    var name_elm = '<h3>'+name+'</h3>';
    var noq_elm = '<span>'+number+'</span>';

    var $list_elm = '<li>'+name_elm+''+noq_elm+'</li>';

    $('#list').append($list_elm);
}

我使用.append(...)后。我想向每个列表添加点击监听器(每个列表都有唯一的 id)。

我应该如何编写查询来为每个 <li></li> 添加监听器?

最佳答案

您可以使用event delegation :

var $list_elm = '<li class="noqele">'+name_elm+''+noq_elm+'</li>';
$('#list').append($list_elm);
}

点击事件代码:

$(document).on('click','.noqele',function(){
    //click event code...
});

关于javascript - 如何为每个元素添加点击事件监听器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23872273/

相关文章:

php - 动态查询数据库以检查值

javascript - 将 CoffeeScript 问号语法翻译成 Javascript

php - 如何在Jquery中隐藏/显示多个对象?

javascript - 带有 iframe 子级的可拖动/可调整大小的 div,它可以通过一些填充/边距延伸到父级?

java - Eclipse:是否可以将 Javascript 编辑发布到外部 Tomcat 实例

jquery - 使用 jQuery isotope 插件设置宽度和高度

javascript - 如何在多个 jQueryUI 日期选择器中遮盖特定日期

javascript - 将数据属性放在 DataTables 1.10 的行上

javascript - Tablesort 在 IE 中无法正常工作

javascript - swagger-无法识别的响应类型;将内容显示为文本