jQuery分页使用.on()和.off()来禁用事件，导致UI元素不响应。

Question

我用jQuery 1.8.0写了一个自定义分页方案。我将事件处理程序绑定到后退和前进按钮上。为了在第1页时禁用后退按钮，我使用.off()函数来禁用绑定。当我向上翻页时，我在按钮上调用.on()来再次启用绑定。当我三次改变一个事件绑定的on-off状态时，问题就会发生。之后，事件就不会再发生了。

下面是我的代码的一个精简版本。这将说明我的问题。

这就是事件。后面的按钮的id为prePageLink。

$("#prevPageLink").click( function() {
  // Decrement the current page
  global_currentPage--;

  // Check to see if first or last page clicked
  handlePaginationButtonState();

  // Decrement the results indicies
  startResultsIndex -= global_totalResultsPerPage;
  endResultsIndex = startResultsIndex + global_totalResultsPerPage - 1;

  getNextResults();  
});

函数handlePaginationButtonState完成了打开和关闭后退和前进按钮的工作。

function handlePaginationButtonState() {

  if (global_currentPage == 1) {
    $("#prevPageLink").parent().attr('class', 'disabled');
    $("#prevPageLink").off('click');
  } else {
    $("#prevPageLink").parent().attr('class', 'enabled');
    $("#prevPageLink").on('click');
  }  // the rest of this function takes care of the numbered and right page buttons

所以当web应用第一次带回结果时，会加载前10个结果。如果我做以下操作。

1. 下一页（到第2页）--打开绑定。
2. 上一页（回到第1页）--装订关闭
3. 下一页(至第2页)--开启竞价模式

我无法翻到上一页，回到第1页。prePageLink按钮不再有反应。我已经用下一页按钮和结果列表的末尾以及编号页按钮进行了测试。如果使用.on()或.off()函数打开或关闭了一个绑定，它就不再响应事件。

有什么好办法吗？我完全被搞糊涂了。

Answer 1

" 如果使用.on()或.off()函数打开或关闭了一个绑定"

$("#prevPageLink").on('click') 并没有像你所想的那样，事实上，它什么都没有做，因为你没有提供足够的参数。这个 .on() 方法并不开启先前删除的事件处理程序，而是绑定一个新的事件处理程序，因此你必须提供事件发生时将被调用的函数。换句话说，你必须提供事件发生时将被调用的函数。

$("#prevPageLink").on('click', function() { /* some code */ });
/// does the same thing as:
$("#prevPageLink").click(function() { /* some code */ });

这个 .off() 办法 移除 之前绑定的处理程序，它不会暂时禁用它。

如果你想继续重新绑定同一个函数，不要使用匿名函数。

function myClickHandler() {
    // your code here
}
$("#prevPageLink").on('click', myClickHandler);
// remove it:
$("#prevPageLink").off('click');
// add it again:
$("#prevPageLink").on('click', myClickHandler);

更多信息请参考 阅读 的 .on() 文件.

但比起删除和重新绑定处理程序，我认为更容易的做法是让处理程序一直留在原地，让它测试你是否已经在第一页了--在函数的开头添加这样的内容。

if (global_currentPage === 1)
   return false;