Question

我开发了一个测验模块，当用户点击submit按钮时，该按钮会显示disabled，然后重定向到下一个问题。

现在问题是submit按钮有时不会响应大约4-5次或更多次点击，然后突然提交表单，导致跳过4-5个问题。已尝试使用document.form.submit甚至jQuery('#question_form').submit()。但仍然很少有用户报告同样的问题。

我无法为自己创建相同的方案。

在我的视图页面中，我有：

   <form id="question_form" style="text-align:center;" name="question_form" method="post" action="/exam/259/calc_current_score?name=question" accept-charset="UTF-8">
    <!-- some fields to be submitted -->
    <input type="submit" value="Submit" onclick="changeButtonText(event,this.form);" name="submit_button" id="submit_button" class="exam-btn-primary">

    </form>

   <script type="text/javascript">
    function changeButtonText(e,form){

//if validation is true then it submits the form like this
        error_notification.style.display="none";
        form.submit();
        jQuery('#submit_button').css({'background-color':'#C3CACD'});
        form.submit_button.disabled=true;
        return true;

//else if the validation fails then 'submit button' is not disabled
        e.preventDefault();
    }
    </script>

因此，主要问题是，即使用户在选择选项后单击提交按钮，表单也不会提交（最终会重定向到下一页），按钮也不会disabled（也是验证成功后，按钮的颜色会发生变化，因此它们会一直点击，这主要发生在Google Chrome中。我不知道是因为网络连接速度慢还是资源需要更长的时间来加载。

用户报告有时他们必须多次点击才能提交问题的答案，并且每当他们点击多次时，问题就会被跳过。例如，如果他们在x点击submit button次，他们会向x个问题前进，他们就无法得分。

Answer 1

我遇到过类似的问题。在我的情况下，Android平板电脑上的浏览器有时会在一次点击时运行ontouch个事件和onclick事件。当用户点击提交按钮后快速点击任何其他位置时，就会发生这种情况。在preventDefault();和ontouch同时致电onclick时，问题就解决了。如何检查用户使用的浏览器和终端类型？

ADD：

好的，你的实际问题是“即使它被禁用也会点击提交按钮”，不是吗？

试试这个

<script type="text/javascript">
    function changeButtonText(e,form){
        form.submit_button.disabled=true;

//if validation is true then it submits the form like this
        error_notification.style.display="none";
        jQuery('#submit_button').css({'background-color':'#C3CACD'});
        form.submit();

//else if the validation fails then 'submit button' is not disabled
        form.submit_button.disabled=true;
        e.preventDefault();
    }
</script>

Answer 2

这完全是因为jQuery在Windows XP计算机上被阻止了。但我仍然删除了submit代码并使用div代码作为按钮，它解决了问题。

表单提交按钮有时不起作用

2 个答案: