Javascript event.preventDefault 不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8540395/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
event.preventDefault not working
提问by Peter Stuart
I have this simple code here, nothing too advanced.
我这里有这个简单的代码，没有什么太高级的。
$("input#send").submit(function(event){
event.preventDefault();
$.ajax({
type: 'POST',
url: add.php,
data: data,
success: success,
dataType: dataType
});
});
Whever I click on the "send" button, the event.preventDefaultfunction doesn't work, and the page loads.
无论何时单击“发送”按钮，该event.preventDefault功能都不起作用，并且页面加载。
Any ideas why?
任何想法为什么？
回答by pimvdb
A formhas the submit event, not a button. Plus, an ID should be unique so tag#idcan just be #id.
一个表单有提交事件，而不是一个按钮。另外，ID 应该是唯一的，因此tag#id可以是#id.
$("#theform").submit(function(event) {
event.preventDefault();
// ...
});
回答by Jasper
You need to bind to the form's submitevent or to the button's clickevent and call event.preventDefault()if you want to stop the form from submitting:
如果您想阻止表单提交，您需要绑定到表单的submit事件或按钮的click事件并调用event.preventDefault()：
$('form').bind('submit', function (event) {
event.preventDefault();
});
$('form').find(':submit').bind('click', function (event) {
event.preventDefault();
});
回答by epignosisx
I believe the submit event is for the formelement. For an input[type='button']you might want to use the click event.
我相信提交事件是针对表单元素的。对于input[type='button']您可能想要使用 click 事件。
回答by jessegavin
- Add quotes around
'add.php' - Change the selector in the first line to the
idattribute of the form which containsinput#send.
- 在周围添加引号
'add.php' - 将第一行中的选择器更改为
id包含input#send.
The advantage of handling the submit()handler on the form rather than the clickhandler on the input is that some forms can be submitted by pressing the enter key (when the user is focused on one of the form fields). If you don't have an idattribute, add one or use a different jQuery selector to target the form tag.
处理submit()表单上的处理程序而不是click输入处理程序的优点是可以通过按回车键提交某些表单（当用户专注于表单字段之一时）。如果您没有id属性，请添加一个或使用不同的 jQuery 选择器来定位表单标记。
$("#myform").submit(function(e) {
e.preventDefault();
$.ajax({
type: 'POST',
url: 'add.php',
data: data,
success: success,
dataType: dataType
});
return false;
});
回答by Greg Pettit
If you're using preventDefault I assume that means you do NOT want the default submit action. I would just use a different event instead of using .submit. To me, it's not the submit action that you want to intercept, but rather the click that would normally cause the submit.
如果您使用 preventDefault 我认为这意味着您不想要默认提交操作。我只会使用不同的事件而不是使用 .submit。对我来说，您想要拦截的不是提交操作，而是通常会导致提交的点击。
$('#inputSend').on('click', function(event) {
event.preventDefault();
//the rest
});
回答by wag0325
If both return falseand event.stopPropagation()don't work, try the following method. Using .on()will make the submit function accessible. Once you change the .submit()to .on("submit"..), you can either use return falseor e.stopPropagation().
如果同时return false和event.stopPropagation()不工作，试试下面的方法。使用.on()将使提交功能可访问。将 更改为.submit()后.on("submit"..)，您可以使用return false或e.stopPropagation()。
$(document).on("submit", "input#send", function(event) {
event.stopPropagation();
$.ajax({
type: 'POST',
url: add.php,
data: data,
success: success,
dataType: dataType
});
return false; });
回答by Josh Toth
Try using return false instead
尝试使用 return false 代替
$("input#send").submit(function(event) {
$.ajax({
type: 'POST',
url: add.php,
data: data,
success: success,
dataType: dataType
});
return false;
});
