在Firefox中提交按钮刷新页面

时间:2014-06-08 18:51:28

标签: jquery forms validation firefox

我在购物车结帐页面上有一个表单,用户将填写表单并单击按钮以验证表单而不离开页面。完成验证后,结帐按钮会更改类,可以单击。

这一切都在chrome中干净利落,但是当你单击验证按钮并且表单清空时,firefox只刷新页面。我需要改变什么来在Firefox中工作?

HTML

<form name="contact"id="contact" onSubmit="return checkform()" method="post" action="" >
<fieldset> 
<label for="firstname">Full Name</label>
<input onkeyup="checkform()" type="text" name="firstname" placeholder="Full Name"  class="required" id="first_name">

<label for="address">Address</label>
<input onkeyup="checkform()" type="text" name="address" placeholder="Address" class="required" id="address">

<label for="Company">Company</label>
<input onkeyup="checkform()" type="text" name="company" placeholder="Company" class="required" id="company">

<label for="email">Email</label>
<input onkeyup="checkform()" type="text" name="email" placeholder="yourname@domain.com"  class="required email" id="email">

<label for="phone">Phone</label>
<input onkeyup="checkform()" type="text" name="phone" placeholder="(xxx) xxx xxxx`" id="phone">
<button id="btn" type="button" class="validation">Validate</button>

</fieldset>

jquery的

$(document).ready(function () {

$('#contact').validate({ // initialize the plugin
    rules: {
        firstname: {
            required: true
        },
        address: {
            required: true
        },
        company: {
            required: true
        },
        email: {
            required: true
        },
        phone: {
            required: true
        },
    },
});

$('#btn').click(function() {
     event.preventDefault();
    if ($('#contact').valid()) {
        alert('Form is Valid, Please click Send Order');
        $("#btn-submit").removeClass("disabled");
        $("#btn-submit").addClass("simpleCart_checkout");
        $("#btn-submit").attr("href", "javascript:;");


    } else {
        alert('Please Complete all Required Feilds');

    }
});

});

2 个答案:

答案 0 :(得分:1)

这里需要一个参数来引用事件对象:

$('.btn').click(function(e) {
   e.preventDefault();
   ...
});

答案 1 :(得分:0)

event参数作为参数传递给点击处理程序

$('.btn').click(function(event) {
                           ^