jQuery 处理表单内的按钮点击

Question

我不明白为什么我的 jQuery 代码无法访问表单中的按钮。

<form action="">
    <div class="field">
        <label for='username'>Insert username</label>
        <input type="text" id="username" name="username">
    </div>

    <button type='submit' class='btn btn-lg btn-primary buttonRegister'>Register</button>
</form>

这是我的 jQuery 点击尝试代码：

$('.buttonRegister').submit(function(){  
    //action inside function
});

----------------或---------------------

$('.buttonRegister').click(function(){  
    //action inside function
});

----------------或---------------------

$('.buttonRegister').on("click", function(){  
    //action inside function
});

None 他们成功了。我确定点击功能中的代码有效，因为我尝试将按钮置于表单之外并且效果很好。

Answer 1

先在里面添加 e.preventDefault()。

$('.buttonRegister').on("click", function(e){  
   e.preventDefault(); // <<-- required to stop the refresh
   //action inside function
});

jQuery 处理表单内的按钮点击

jQuery handle button click inside a form

javascript

forms

jquery

function

click