如何防止用户单击按钮两次（如果指定了 onclick 属性，JSF 命令按钮不执行操作）答案

【问题标题】：How to prevent from user from clicking button twice(JSF command button not performing action if onclick property specified)如何防止用户单击按钮两次（如果指定了 onclick 属性，JSF 命令按钮不执行操作）
【发布时间】：2012-10-11 14:29:33
【问题描述】：

  <h:commandButton styleClass="button"  id="button_check" onclick="this.disabled=true;this.value='Please wait...';" action="#{pc_AMyBean.doCheckAction}" value="CHECK NOW"/>

此命令按钮执行 onclick 事件，但不调用操作。它是 JSF 1.2。我的意思是它正在禁用按钮但没有执行所需的操作。

如何防止用户提交表单两次？如果是订单，则会提出两个订单。

请帮帮我。

【问题讨论】：

尝试oncomplete而不是onclick
oncomplete 在 JSF1.2 中不可用
@mstzn：你对 PrimeFaces 感到困惑。
是的，我与 Primefaces、Richfaces 混淆了

标签： jsf button

【解决方案1】：

我可能是因为您在调用操作之前禁用了按钮。尝试像这样使用setTimeout()

<h:commandButton styleClass="button"  id="button_check" 
   onclick="setTimeout('document.getElementById(\'' + this.id + '\').disabled=true;', 50);" 
   action="#{pc_AMyBean.doCheckAction}" value="CHECK NOW"/>

【讨论】：

【解决方案2】：

刚刚在 JSF 1.2 中遇到了类似的情况。

我们添加了一个小的 javascript IIFE 来禁用该按钮，但仅在第二次点击之后。这样第一次提交就不会因为被禁用而被取消。 setTimeout() 解决方案的问题是它仍然允许在禁用按钮之前双击。您可以通过在 javascript 中编写一个由 JSF onclick 调用的函数，以更 JSF 的方式执行此操作。但我们更喜欢将所有代码放在一个地方。

(function($) {
    var clickCounter = 0;
    $('#button_check').on('click', function() {
        if (clickCounter > 0) {
           $(this).attr('disabled', true);
        }
        clickCounter += 1;
    }
})(jQuery);

这对我们有用，表单发布只发生一次。

【讨论】：