jquery - 动态填充的 UL 项目第一次无法点击，之后就好了

Question

我有一个 jQuery 函数，它接受输入并使用它来过滤链接列表。当输入任何内容时，该函数会清空现有的 UL，然后用新的 LI 元素填充它，每个元素都包含一个链接。这些链接通过 jQuery 的“click”方法连接起来。

这些生成的链接是可点击的，但前提是用户首先点击页面上输入框之外的任何其他位置。如果用户在填充列表后尝试立即单击链接，则该链接不起作用。

可能的提示？如果我右键单击该链接并选择“检查元素”，它会将外部 UL 显示为事件元素，而不是我单击的 LI。如果我先单击其他任何地方，然后检查该元素，则 LI 是事件元素。

此外，如果我跳过清空 UL 的步骤，而只是附加到现有列表，则所有链接都会按预期工作。

无论如何，在填充新列表后 UL 似乎立即“位于顶部”这一事实似乎表明了为什么链接没有被单击。因此，问题是为什么 UL 会收到这样的焦点(或者至少直到单击页面上的某些内容(任何内容)为止)？

Answer 1

尝试使用.on(以前的.live)方法而不是.click，这样它将连接到添加的任何内容自动到 DOM:

//instead of:
$('.abc').click(function() { alert('hi'); });

//use this:
$('.abc').on('click', function() { alert('hi'); });

jQuery .on()