在jquery中增加变量click（）

使用此代码，我正在尝试将click事件动态绑定到元素并引用递增的变量：

  $(document).ready(function() { function preprocessPage(id){ $('.nextPage').click(function(){ showPage(++id); }); } function showPage(id){ console.log('showing: '+id); preprocessPage(id); } showPage(1);//init }); 

 
show next page 

当页面加载时，它似乎按预期工作。 第一次点击似乎有效。 事情变得棘手了。 它似乎多次运行代码（增加2倍）如果你单击div 4次（第一个日志行发生在init加载后），这就是你在firebug控制台中看到的内容：

显示：1

显示：2

显示：3

显示：3

显示：4

显示：4

显示：4

显示：4

显示：5

显示：5

显示：5

显示：5

显示：5

显示：5

显示：5

显示：5

请帮忙！ 这是怎么回事？ 提前致谢….

Answer 1

每次单击调用show page，向与选择器.nextPage匹配的元素添加新的onclick处理程序。

有时，在头脑或纸上执行代码以了解正在发生的事情是很好的。 我已经强调了事情失控的事件。

1. 电话showPage(1)
2. 打印showing page 1
3. 调用preprocessPage(1)
4. 将onclick处理程序A添加到.nextPage
5. 单击.nextPage
6. 将处理程序A中的id从1增加到2
7. 致电showPage(2)
8. 打印showing page 2
9. 调用preprocessPage(2) 。
10. 将onclick处理程序B添加到.nextPage
11. 单击.nextPage
12. 将处理程序A中的id从2增加到3
13. 致电showPage(3)
14. 打印showing page 3
15. 调用preprocessPage(3)
16. 将onclick处理程序C添加到.nextPage
17. 将处理程序B中的id从2增加到3
18. 电话showPage(3)
19. 打印showing page 3
20. 调用preprocessPage(3)
21. 将onclick处理程序D添加到.nextPage
22. …

以下内容应该更接近您的要求

 $(document).ready(function() { function showPage(id){ console.log('showing: ' + id); } // Start with page 1 var id = 1; // Show the first page showPage(id); // Add onclick handler to each element with class="nextPage" $('.nextPage').click(function(){ // Increment the page id and then call showPage with the current id showPage(++id); }); });