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/

从小提琴中可以看出，只要我在文本框中输入，＆＃34;点击＆＃34;打印出来。我打字时对我的函数不感兴趣。在较新版本的Jquery中，如果我将live替换为on，它就能完美运行。

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

上

Answer 1

问题是因为您错误地使用了live()。您当前使用的方法签名与委派的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年。

Answer 2

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

试试这个我会工作

在1.6中的jquery事件处理程序中遇到问题而不是最新版本。

2 个答案: