Question

我在页面内部使用jQuery Mobile。

这只是一个很好的形式，没什么特别的：

<form action="index.php" method="post">
    <input type="text" name="owner" id="owner" />
    <button type="submit">Add</button>
</form>

如果我在脚本块中添加以下内容（注意：封闭$（function（）{}）;为清晰起见，省略了：

$('form').submit(function(event){
    // event.preventDefault(); doesn't work here?!?
    return false;
});

...无论如何都不会提交表格。但是，这种方法不能与jQuery Mobile一起使用，因为在页面更改后，更改DOM时不会应用事件绑定。

所以，如果我尝试这种方法：

$(document).on('submit', 'form', function(event){
    // event.preventDefault(); doesn't work here as well...
    alert('submit!');
    return false;
});

...表单将被提交，即使它返回false（并且在单击按钮时有警报）。

这里发生了什么，以及如何获得预期的行为？

Answer 1

不要将处理程序附加到表单，而是为“提交”按钮执行此操作。

event.preventDefault()

肯定会阻止表单提交＆amp;一旦您完成验证（或在表单提交之前您想做什么），您可以使用

触发表单提交

$('#target').submit();

如何使用.on（）方法处理提交事件时阻止表单提交

1 个答案: