我们为客户提供付款明细表,以及" 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>