我想阻止使用jQuery提交表单,而是在用户想要提交时运行一个函数。
这是我的表单标记:
<form action="" method="post" id="msg-form">
<p><textarea name="msg"></textarea><input type="submit" value="Send"></p>
</form>
我的Javascript代码:
$('#msg-form').submit(function() {
return false;
}
但是,当我按下提交按钮时,表单仍然会被发送并且页面会刷新。如何正确阻止表单提交?
答案 0 :(得分:1)
submit
事件实际上并未绑定到表单元素。在加载DOM之后,您可能忘记了绑定它!
将事件绑定放在$(document).ready(function() {
内或在页面底部加载脚本(在加载所有元素之后)。
答案 1 :(得分:1)
似乎事件处理程序甚至没有执行,因此我假设找不到表单。尝试将代码封装在DOM准备就绪时执行的处理程序中。在jQuery中,它可以简单地完成:
$(function(){
$('#msg-form').submit(function(event) {
event.preventDefault();
// code executed when user tries to submit the form
});
});
另外,如上所示,您可以在提交表单时阻止表单的默认行为。
答案 2 :(得分:0)
$('#msg-form').submit(function(e){
e.preventDefault();
});
答案 3 :(得分:0)
您无法为用户提供真实的提交按钮,只能在验证后使用JS提交表单:
<强> HTML 强>
<form action="" method="post" id="msg-form">
<p><textarea name="msg"></textarea><input id="submit" type="button" value="Send"></p>
</form>
<强> JS 强>
$('#submit').on('click', function() {
// validate
$('#msg-form')[0].submit();
});
答案 4 :(得分:0)
尝试:
$("#msg-form").submit(function (e) {
e.preventDefault();
});
答案 5 :(得分:0)
这有效
<form action='' onsubmit="return false;">
就像这样
<form action='' onsubmit="doSomeWork();return false;">