javascript - 在 1.6 中的 jquery 事件处理程序中面临问题，而不是在最新版本中。

Question

目前我有一个 Jquery 1.6 版本的库，有时间更新。我正在尝试实现 Jquery 事件处理程序。

我有一组有很多按钮的 div。按钮不断动态添加，我正在尝试使用 Jquerys 事件处理程序来跟踪新添加的按钮。

<div class="reason_badCode">
    <input type="text" /><input type="button" value="Click Me" rel="button_reason_badCode"/>
    <input type="text" /><input type="button" value="Click Me" rel="button_reason_badCode"/>
    <input type="text" /><input type="button" value="Click Me" rel="button_reason_badCode"/>
</div>

<div class="reason_someOtherBadCode">
    <input type="text" /><input type="button" value="Click Me" rel="button_reason_someOtherBadCode"/>
    <input type="text" /><input type="button" value="Click Me" rel="button_reason_someOtherBadCode"/>
    <input type="text" /><input type="button" value="Click Me" rel="button_reason_someOtherBadCode"/>
</div>

现在不断添加按钮和文本框的组合。

$('div[class^="reason_"]').live('click', 'input[rel^="button_reason"]', function(event) {
    console.log("clicked");
});

我的 JsFiddle:https://jsfiddle.net/994ndy9c/

正如在 fiddle 中看到的那样，只要我在文本框中键入内容，就会打印“clicked”。我对打字时调用的函数不感兴趣。 在较新版本的 Jquery 中，如果我将 live 替换为 on，它会完美运行。

有没有办法让这个在 jquery 1.6 上工作

Answer 1

问题是因为您错误地使用了 live()。您当前使用的方法签名匹配委托(delegate) on() 处理程序所需的内容，而不是 live()。

相反，您需要选择动态元素作为主要选择器，并仅使用事件名称字符串和处理函数对其调用 live()，如下所示:

$('input[rel^="button_reason"]').live('click', function(event) {
  console.log("clicked");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<div class="reason_badCode">
  <input type="text" />
  <input type="button" value="Click Me" rel="button_reason_badCode" />
  <input type="text" />
  <input type="button" value="Click Me" rel="button_reason_badCode" />
  <input type="text" />
  <input type="button" value="Click Me" rel="button_reason_badCode" />
</div>

<div class="reason_someOtherBadCode">
  <input type="text" />
  <input type="button" value="Click Me" rel="button_reason_someOtherBadCode" />
  <input type="text" />
  <input type="button" value="Click Me" rel="button_reason_someOtherBadCode" />
  <input type="text" />
  <input type="button" value="Click Me" rel="button_reason_someOtherBadCode" />
</div>

话虽如此，我强烈建议您升级您正在使用的 jQuery 版本，以便您可以利用 jQuery 的 on() 方法和其他性能改进。 1.6 已经超过 6 年了。