防止用户重复点击链接答案

【问题标题】：Prevent users from repeatedly clicking on links防止用户重复点击链接
【发布时间】：2011-07-20 14:07:54
【问题描述】：

当您单击给定链接时，它会加载一个进行存储过程调用的页面。如果存储过程调用花费的时间超过几秒钟，人们就会再次开始单击该链接。如果他们点击链接十几次，我可以看到数据库上运行了十几个查询。最后一个查询是唯一一个向用户返回任何内容的查询，但其他 11 个查询在使用资源时执行完成。

防止这种情况的最佳方法是什么？有没有办法在数据库级别停止它或者这是一个接口问题？这是我使用 PHP 建立数据库连接的结果吗？

【问题讨论】：

How to prevent users from clicking multiple times on a linked image? 的可能重复项
该解决方案最终可能与该解决方案重复，但我希望找到替代解决方案。如果我可以在数据库或服务器端 (PHP) 中解决这个问题，我更喜欢使用 javascript 禁用元素的解决方案。

【解决方案1】：

就我个人而言，我会解决界面问题 - 用户多次点击背后的原因不是用户错了，而是您的网站没有传达任何关于它试图做什么的信息。考虑将链接设置为禁用 onclick，可能会显示某种加载动画，然后在获得数据回调后重新启用链接。这样，UI 始终反映后端状态，还可以防止用户排队一堆请求！

【讨论】：

点击时禁用链接的问题是，例如，当连接断开时。如果未收到回调，则无法再次单击链接（单击两次的正当理由），并且如果用户必须刷新，表单中的任何数据都可能丢失。在这种情况下：使用超时重新启用链接。
非常好的建议 - 您最不想看到的就是禁用 UI，因为它依赖于无法保证的某些东西。

【解决方案2】：

一种解决方案可能是在查询期间禁用链接。您可以使用一些更新当前页面的本地 JavaScript 来执行此操作，或者切换到根本没有链接的另一个页面 - 这完全取决于您的网站设计。

另一种选择是在代码中设置一个保护变量，以便它仅在未设置时调用存储过程：

if (!callingProcedure)
{
    callingProcedure = true;
    call procedure
}

然后当程序返回时将callingProcedure重置为false。

拥有某种进度指示器也会有所帮助 - 向您的用户提供网站实际在做某事的反馈。

【讨论】：

【解决方案3】：

在处理请求时使用jQuery BlockUI Plugin 之类的东西来阻止页面。这可以让您的用户确定正在发生的事情，并防止他们再次点击。

【讨论】：