PayPal フォームがあり、ユーザーがクリックしたときに「送信」ボタンの画像を別のものに変更したいと考えています (フォームが有効である場合)。
私が抱えている問題は、.validate() を追加して関数をクリックすると、すべてが壊れてしまうことです。もう何も検証されません + 送信ボタンは変わりません。
誰かが私が間違っていることを教えてもらえますか?
これが私のコードです:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
<form action="https://www.paypal.com/cgi-bin/webscr" id="paypal_form" method="post">
<table align="center">
<tr><td><b>Registration Code</b>:</td><td><input type="text" size="25" name="os0" id="os0" value=""></td></tr>
<tr><td><b>E-Mail Address</b>:</td><td><input type="text" size="25" name="os1" id="os1" value=""></td></tr>
<tr><td><b>Confirm E-Mail</b>:</td><td><input type="text" size="25" name="os2" id="os2" value=""></td></tr>
<div id="error_messages"></div>
<input name="submit" id="submit" class="submit" type="image" src="/images/paypal.gif">
</td></tr></table></form>
<script>
jQuery(document).ready(function($) {
$('#paypal_form').validate();
$('#submit').click(function()
{
if ($("#paypal_form").valid() === true)
{
document.getElementById('submit').src = "http://www.example.com/images/loading.gif";
}
});
$.validator.addMethod("RegCodeRegex", function(value, element) {
return this.optional(element) || /^[bB][A-Za-z]{6}[-][A-Za-z][0-9]+$/i.test(value);
}, "Invalid registration code!");
$('#paypal_form').validate({
rules: {
os0: {
required: true,
RegCodeRegex: true
},
os1: {
required: true
},
os2: {
required: true,
equalTo: "#os1"
}
},
messages: {
os0: {
RegCodeRegex: "Invalid Registration Code!"
},
os1: {
required: "Please enter in your email address<br>"
},
os2: {
required: "Please confirm your email address",
equalTo: "Email addresses do not match!"
}
},
errorContainer: "#error_messages",
errorLabelContainer: "#error_messages"
});
});
</script>