提交按钮有时会以 html 形式执行两次操作答案

【问题标题】：Submit button sometimes executes the action twice in html form提交按钮有时会以 html 形式执行两次操作
【发布时间】：2016-06-24 00:19:57
【问题描述】：

在我的 HTML 表单中，当我单击提交按钮时，它被禁用，因此用户无法单击它两次。此按钮发送一封电子邮件，但是当我测试此表单时，有时按钮会执行两次操作，尽管我单击它一次，有时它可以正常工作并且只执行一次操作。这是我的代码：

<form id="request-form" action="http://premitek.slayer.nabdsys.com/UserAccount/Create" class="contact-form">
    <input name="txt" id="txt" type="text"> 
    <input value="Sign up" 
           id="btnSignUp"
           onclick="goog_report_conversion();ToGetTrackingCode();"
           class="btn btn-primary btn-lg"
           data-loading-text="Loading..." 
           type="submit">
</form>

$("form").submit(function (e) {
    if ($('#CaptchaEnter').val().toLowerCase() != $('#randomfield').val().toLowerCase() || $('#CaptchaEnter').val() == "") {                   
        e.preventDefault();               
        $('#captcha').attr(
             "style", 
             "border-color: #a94442; box-shadow: inset 0 1px 1px"
        );
        $('#verCapacha').show();
    } else {
        $('#captcha').attr("style","");
        $('#verCapacha').hide();
        $('#btnSignUp').prop('disabled', true);
        ShowProgress();
    }
});

【问题讨论】：

顺便说一句，您应该删除onclick 属性并在submit 处理程序中调用goog_report_conversion() 和ToGetTrackingCode()。此外，添加/删除类而不是覆盖元素上的 style 属性会更好。
@RoryMcCrossan 你认为这会导致问题吗？！
我不知道根本原因是什么，但是为什么要定义一个 onclick 处理程序来仅通过单击来报告转换？您是否打算在点击和验证码都成功时报告转化，或者您想跟踪所有点击量而不管验证码是否成功？无论如何，我同意@RoryMcCrossan 的所有逻辑都应该在提交本身中。我不喜欢在不同的地方添加多个处理程序的想法。

标签： javascript php jquery html css

【解决方案1】：

您的页面上是否只有一个表单标签？您已经为每个表单元素设置了提交功能。您可能应该通过表单 id 来设置它。

另外，当您说“执行操作”时，您的意思是发送电子邮件吗？还是运行JS函数？如果是电子邮件，请检查以确保没有其他方法可以访问电子邮件代码，包括刷新页面。

【讨论】：

我的页面上只有一个表单标签......我的意思是执行“发送电子邮件”操作有时会发送两次电子邮件......有时会发送一次....你知道这个奇怪问题的原因吗？
提交表单后，会发生什么？您尚未显示发送电子邮件的代码。是否有“感谢页面”之类的？如果您在该页面上重新加载浏览器会发生什么？它会重新提交表单吗？