为什么在按下提交按钮后会发生引导程序表单验证?

时间:2015-02-05 04:13:19

标签: javascript jquery html forms twitter-bootstrap

我有一个使用bootstrap构建的表单,我发现表单验证在提交按钮的onclick事件之前没有运行,这是没用的。

请看这个小提琴的例子 - 按下2个表格上的注册按钮,看看我的意思。

http://jsfiddle.net/5tr34k/ax13nLof/

我想要一种方法来阻止onclick事件发生,直到表单验证成功通过,然后运行onclick javascript

     <h3>Example</h3>
    <form action="" method="post" name="registration_form1">

    <input type="text" class="form-control" placeholder="Username" required name="username" id="username">
    <input type="email" class="form-control" placeholder="Email" required="true" name="email" id="email">
    <input type="password" class="form-control" placeholder="Password" required name="password" id="password">
    <input type="password" class="form-control" placeholder="Confirm Password" required name="confirmpwd" id="confirmpwd">                  
     <button id="myButton2" onclick="alert('i happen before validation');" type="submit" class="btn btn-default" >Register</button>
    </form>

在上面的代码中,javascript警报在表单验证之前运行。是否可以防止或更改这些以便在表单验证后运行javascript?

1 个答案:

答案 0 :(得分:2)

您需要使用表单的提交事件,而不是按钮的单击事件

$('#form').on('submit', function (e) {
    //your awesome code here
    alert('I HAPPEN BEFORE FORM VALIDATION');
})

演示:Fiddle