Question

我有一个jQuery函数，它为表中为API返回的每个搜索结果添加一行。每行包含一个链接按钮，该按钮被赋予类'js-run-apn-button'。

单击链接时，它应该触发函数apnData，但无法触发。我很确定这是因为在首次加载dom之后添加了链接类，因此事件无法绑定。我可以通过在创建新类而不是$ document.ready（）函数的函数内添加事件处理程序来修复此特定问题，但这会使程序复杂化。所以我想知道是否还有另一种解决方法，更广泛地说，一般来说，处理这个问题的最佳方法是什么。

$(document).ready(function() {
    $('.js-run-apn-button').on('click', apnData);
    ...
}

function multipleResults(response) {
    $('.result-table > tbody').append('<tr><td><a class="button blueButton js-run-apn-button" href="#">Search APN</a></td></tr>');
    ...
}

Answer 1

使用.on()。

您必须为动态生成的元素正确处理事件委派。您必须使用以下语法。

$('document').on('click','.js-run-apn-button', apnData);

注意：请勿使用document来解决性能问题。使用最近的父项，它是静态的，而且总是存在于DOM中。

对于1.7及更早版本的jquery版本，请使用.live()。语法如下。

$(".js-run-apn-button").live("click", apnData);

这在1.7＆amp;在1.9中删除

Answer 2

您必须使用.on函数或.live函数（如果使用较旧的jquery版本＆lt; 1.7，则为.live）。

$(document).on('click', '.js-run-apn-button', function(event){

or

$(".js-run-apn-button").live("click", function(event){

绑定到DOM加载不触发后创建的类的事件处理程序

2 个答案: