jQuery：防止按钮/单击事件上的表单提交

我正在使用以下脚本以确保<select>字段在提交表单时已将值应用于它（默认值除外）。jQuery：防止按钮/单击事件上的表单提交

// form-submit 
$('#form-register form .button').click(function(e) { 
    e.preventDefault(); // don't submit it 
    var submitOK = true; 
    $('#form-register').find("select").each(function() { 
     if ($(this).val() == "Select Brand") { 
       alert ('Please select an appliance and a brand'); 
       submitOK = false; 
       return false; // breaks out of the each 
     } 
    }); 
    if (submitOK) { 
     $('#form-register form').submit(); 
    } 
});

我只好功能绑定到click()事件上的按钮，因为有它在形式的submit()事件导致我的浏览器中的“太多递归”错误。

但是现在我遇到的问题是脚本似乎无法阻止表单提交，即使验证错误是提醒用户。

有谁知道我可以修改它以防止在发生验证错误时提交表单吗？

我开始认为我正在使用Gravity Forms for WordPress，这可能会让事情变得困难。如果有帮助，这里是提交按钮标记（其中包括一些jQuery的）：

<input type="button" onclick="jQuery(&quot;#gform_target_page_number_1&quot;).val(&quot;2&quot;); jQuery(&quot;#gform_1&quot;).trigger(&quot;submit&quot;,[true]); " tabindex="13" value="Register My Appliances" class="button gform_next_button" id="gform_next_button_1_14">

来源

2013-12-22 pealo86

考虑使用形式“的onsubmit”处理，而不是（正如你以前做过）这是根本不可能从“点击”按钮处理程序取消表单提交。 – user2988142

你可以在这个测试页面看到，“点击”处理程序无法取消表单提交 - http://jsbin.com/iDuYefed/1/edit – user2988142

但是，如果我在表单提交上运行函数，那么我会得到一个'太多的递归'错误，因为函数本身触发了'.submit（）'事件。这是你的意思吗？ – pealo86

定了！我rejigged我的剧本就像这样，它似乎很好地工作：

$('#form-register form').submit(function(e) { 

     var error = 0;  
     $('#form-register').find("select").each(function() { 
      if ($(this).val() == "Select Brand") { 
       error ++; 
       } 
     }); 

     if (error > 0) { 
      alert ('Please select an appliance and a brand'); 
      return false; 
     } 
    });

来源

2013-12-22 15:47:36 pealo86

jQuery：防止按钮/单击事件上的表单提交

回答

相关问题