javascript - 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
});

它们都不起作用。我确信点击函数内的代码可以工作，因为我尝试在表单之外使用按钮并且效果很好。

Answer 1

在其他内容之前添加 e.preventDefault() 。

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