jQuery验证 - onclick函数问题

时间:2013-01-10 04:13:21

标签: jquery forms jquery-validate

我有一个PayPal表单,我想在用户点击它时将“提交”按钮图像更改为不同的(提供表单有效)。

我遇到的问题是,当我将.validate()和click函数添加到脚本时,它会破坏所有内容。没有任何验证+提交按钮不会改变。

有人能告诉我我做错了吗?

这是我的代码:

<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>

1 个答案:

答案 0 :(得分:1)

你两次调用$('#paypal_form').validate,一次没有参数,一次参数。删除第一个应该可以使它工作。