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

Question

我需要添加类似于Gmail的功能，其中在多个结果页面上记住项目列表上的复选框，以及离开并返回结果时。我想弄清楚的是这样做的最好方法。我正在使用PHP和jQuery。

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

这听起来很不错，除了一些项目：

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

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

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

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

此外，看起来事件委派方法是个好主意 - 会让事情变得更容易。

Answer 1

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

对于离开页面的用户，您可以使用onbeforeonload事件，但是如果浏览器崩溃或以其他方式退出，则不会被捕获。使用它取决于能够捕获用户更改的重要程度。