防止jQuery验证插件在提交表单时提交表单

我想使用http://jqueryvalidation.org/插件验证表单。但是，我不想提交表单，而是希望首先显示结果，以便用户可以进一步确认并提交数据。 “额外确定”页面有一个后退按钮，它只显示原始表单，但当显示表单时，它似乎立即触发提交回调。请参阅下面的脚本和http://jsfiddle.net/SF9R4/上的实况示例。我如何防止这种行为？防止jQuery验证插件在提交表单时提交表单

var validator=$("#my-form").validate({ 
    rules: {name:{required:true},address:{required:true},city:{required:true}}, 
    submitHandler: function(form) { 
     //Populate #my-form 
     $('#my-form>div').toggle(); 
    } 
}); 

$('#go-back').click(function(){ 
    $('#my-form>div').toggle(); 
    alert('go-back'); 
}); 

$('#submit').click(function(){ 
    alert('Submit Form'); 
}); 

<form method="post" action="myform.php" id="my-form"> 
    <div class="step1"> 
     <input type="text" name="name" id="name" /> 
     <input type="text" name="address" id="address" /> 
     <input type="text" name="city" id="city" /> 
     <input type="submit" name="submit" value="Submit"> 
    </div> 
    <div class="step2 hidden"> 
     <dl class="info"> 
      <dt>Name</dt><dd id="name"></dd> 
      <dt>Address</dt><dd id="address"></dd> 
      <dt>City</dt><dd id="city"></dd> 
     </dl> 
     <button id='go-back'>Go Back</button> 
     <button id='submit'>Complete</button> 
    </div> 
</form>

来源

2014-02-20 user1032531

@ SpYk3HH。是的，行为很奇怪。该插件是一个很好的插件，但这种行为并不好！ – user1032531

@ SpYk3HH试试我下面的答案的链接。 – user1032531

@ SpYk3HH。同意，想知道。也许该插件确认任何不是“按钮”类型的按钮作为提交按钮？ – user1032531

添加按钮类型。 http://jsfiddle.net/SF9R4/1/

<button id='go-back' type="button">Go Back</button>

来源

2014-02-20 17:23:26 user1032531

我是一个***白痴***！我忘了，表单中按钮的默认'type'是'submit'，因此你的问题！大声笑 – SpYk3HH

@ SpYk3HH。啊哈！那么，我们都被愚弄了，但至少你已经明白了。 – user1032531

PS。我没有更新关于你是白痴的答案，但是出于相反的原因这样做了。 – user1032531

防止jQuery验证插件在提交表单时提交表单

回答

相关问题