记住跨页面复选框 - 最好的方法是什么？

Question

我需要添加与Gmail相似的功能，其中项目列表上的复选框会记录在多页结果中，以及何时离开并返回结果。我试图弄清楚的是做到这一点的最佳方式。我使用PHP和可能的jQuery。

我的第一个想法是添加一个onClick到每个复选框，触发一个AJAX调用回服务器，该服务器将id存储在会话中的数组中。每次加载项目列表时，系统都会检查该行是否已被选中，并在必要时检查复选框。为了可靠性，在检查对服务器的请求是否无法完成（连接问题，服务器错误等）之后，复选框将被取消选中，并且尽可能快地提出请求。

这听起来都不错，除了少数项​​目：

• 检查所有：发生了什么？它是否向服务器发送30个（默认页面项目）请求？或者我删除所有的onClicks，选中复选框，向所有ID发送请求到服务器，然后重新添加onClicks？要么...？类似的问题全部取消选中。
• 速度：有可能开始出现问题，如果用户的100S都检查，并取消选中所有的时间
• 浏览器速度：我想这是最好的页面加载后与JS添加的onClick，我敢如果一页上有500个或更多项目，思考可能需要1秒钟或2秒钟。全部检查会成为一个更大的问题。

在过去，我还没有找到一种可靠的方式来检测用户何时离开页面。如果有可靠的方法，那么我可以看到这是一个选项，因此它只是在每个页面上记录卸载。

有没有其他解决方案或更好的方法？

编辑：如Eran Galperin所述，check all方法只需要检查每个复选框，然后对所有行进行ajax调用。无需删除onClick。

另外，它看起来像事件委托方法是一个好主意—会使事情变得更容易。

Answer 1

1. 当您编程改变复选框的选中状态时，onclick事件不会触发。当用户单击全部取消/取消链接时，您可以发送不同的AJAX请求，而不用担心您附加到单个复选框的点击事件。
2. 这是每次点击使用请求时的权衡。或者使用保存整个表单的“保存”按钮。
3. 使用event delegation - 将一个onclick事件附加到包含所有复选框的整个容器，并检查事件的目标以查看是否单击了复选框。此外，我个人会避免在同一页面上显示500个不同的选项。如果绝对有必要有这么多选项，请将它们分成几个区域/页面。

离开你可以使用onbeforeonload事件的页面的用户，但如果浏览器崩溃或其它非正常退出也不会被抓住。取决于它能够捕获用户更改的关键程度来使用它。