jQuery双提交保护不在safari中工作

时间:2015-04-29 10:04:10

标签: javascript jquery validation safari double-submit-prevention

我们为客户提供付款明细表,以及" Next"按钮被多次点击,我们有保护,不允许创建两个策略。

适用于Chrome,Firefox和EVEN INTERNET EXPLORER 8!可悲的是,它没有在Safari中工作。

有人可以看看下面的代码并帮我们解决这个问题吗?

    $("form").submit(function(event) {
    //validate
    if( $(this).find(".e-clicked").attr("id") === "next" ) { 
        $( this ).find("input[type='submit']").removeClass("e-clicked");
    // console.log("submit event: " + event.srcElement);
        resetGlobalErrors();
        if (fieldsets.get("your-payment").isValid(true)) {
            //protect submit if it's validated ok
            var val = $("input[type=submit]:focus").val();
            var clicked = $("input[type=submit]:focus")
                    .hasClass("preventSubmit");     
            if (val == "Next") {
                if (!clicked) {
                    $("input[type=submit]:focus").addClass(
                            "preventSubmit");
    //                      console.log("not clicked")
                } else {
                    event.preventDefault();
    //                      console.log("clicked")
                }
            }               
            return true
        } else {
    //              $("#next").removeClass("preventSubmit");
            event.preventDefault();              
            return false;
        }
    };
}); 

$(".change-details").click(function() { 
    $(this).parent().hide();
    $(this).parent().next().show();
});
    });


    $("#next").click(function(e){

$(this).addClass("e-clicked"); //define which submit was clicked by adding a class to it

    });

请参阅以下HTML:         

            <div>
                <label for="yourPayment!input_application_selectedPaymentDate">* What date do you want your payment to leave your account each month?</label>
                <select class="paymentDate medium" id="paymentDetails_application_selectedPaymentDate" name="application.selectedPaymentDate">
<option value="-1">Choose...</option>
<option value="1">1st</option>
<option value="2">2nd</option>

            </div>
            <div>
                <label>* Name of account holder:</label>
                <input type="text" class="accountHolder wide first-child justLetters" id="accountHolder" value="" name="application.accountDetails.accountName">



            </div>
            <div class="field-div">
                <label>* Account number:</label>
                <input type="text" class="accountNumber wide first-child justNumbers" id="paymentDetails_application_accountDetails_accountNumber" value="" name="application.accountDetails.accountNumber">



            </div>
            <div class="field-div">
                <label>* Sort code:</label>
                <input type="text" class="tiny sort-code sortcode1 first-child justNumbers" id="sort_code" value="" maxlength="2" name="application.accountDetails.sortCodeFragment1">
                <input type="text" class="tiny sort-code sortcode2 justNumbers" id="sort_code" value="" maxlength="2" name="application.accountDetails.sortCodeFragment2">
                <input type="text" class="tiny sort-code sortcode3 justNumbers" id="sort_code" value="" maxlength="2" name="application.accountDetails.sortCodeFragment3">

            </div>
        </div>

    </div>

</fieldset>

<div>


    <input type="submit" value="Back" name="action:yourPayment!back" id="back">

    <input type="submit" value="Save details" name="action:yourPayment!save" id="save">

    <input type="submit" value="Next" name="action:yourPayment!execute" id="next">

</div>

0 个答案:

没有答案