jQuery:一键触发多个事件

Question

我有一个登录表单，其中有添加成员和重置密码两个链接。我还使用 jQuery Ajax 来更新相应的 div。我正在研究 Google App Engine 和 Python。代码如下:

base.html:

...
<div id="loginDiv">{% include "login.html" %}</div>
...

登录.html:

<a href="/login?arg1=resetPassword" class="resetPassword">Reset Password</a>
<a href="/addMember" class="addMember">Add member</a>

$(document).ready(function() {
  // Add member
  $('body').on('click', 'a.addMember', function() {
    var url = $(this).attr('href');
    $('#content').load(url);
      return false;
  });
  // Reset password
  $('body').on('click', 'a.resetPassword', function() {
    var url = $(this).attr('href');
    $('#loginDiv').load(url);
      return false;
  });
});

问题是:当我点击其中一个按钮时，会触发多个事件。问题是否来自于我对 jQuery 的 $('body') 的错误使用？

Answer 1

确保您没有多次运行该 javascript 代码，如果代码是通过 ajax 加载的，就会发生这种情况。

一个快速解决方法是执行以下操作:

$('body').off('click','a.resetPassword');
$('body').on('click', 'a.resetPassword', function() { ...