将jQuery事件处理程序添加到具有通配符ID的元素

时间:2012-09-11 11:52:18

标签: javascript jquery

我目前在document.ready块中有以下内容:

        $("[id^=summaryDetailLink_]").each(function(index) {
        var splitID = this.id.split("_");
        this.click(alert('clicked: '+splitID[1])); //toggleDetail(splitID[1])
    });

最终我想检测何时点击ID为“summaryDetail_”的TD,并使用从TD.ID属性中获取的ID激活toggleDetail函数。

以上似乎生成了正确的ID(警报弹出窗口),但是在页面加载时触发,而不是在我点击元素时触发。

问题1 - 为什么它会在页面加载时触发而不是创建一个处理程序来单击每个元素并等待该单击?

问题2,在阅读这个问题时,似乎在表上创建单个事件处理程序更为明智,而TD则确定单击了哪个TD元素。我如何转换代码来做到这一点?

2 个答案:

答案 0 :(得分:1)

我认为你误解了点击处理程序的工作原理:

$(function() {
    $("[id^=summaryDetailLink_]").click(function() {
        var splitID = $(this).id.split("_");
        alert('clicked: '+splitID[1])
    });
}

答案 1 :(得分:1)

回答第一个问题:

$(function() {
    $("[id^=summaryDetailLink_]").click(function() {
        var splitID = $(this).id.split("_");
        alert('clicked: '+splitID[1])
    });
}

回答第二个问题,你可以这样做:

$('table#yourtable').on('click', '[id^=summaryDetailLink_]', function(e) {
    var splitID = $(this).id.split("_");
    alert('clicked: '+splitID[1])
});