防止表单提交到不同的页面答案

【问题标题】：prevent form from submitting to a different page防止表单提交到不同的页面
【发布时间】：2012-01-17 08:53:04
【问题描述】：

我有这个代码：

<form method="get" action="" id="search">
<input id="search_box" name="search" type="text" class='search_box'  onkeypress="if(event.keyCode==13) sentAjax('searchdata.php');var filelink='searchdata.php';"  value="" onclick="this.value=''" />
        <input type="hidden" name="course_val" id="course_val" />
</form>

我想阻止表单提交到不同的页面。现在如果你按 Enter 键，它会提交到不同的页面

【问题讨论】：

标签： javascript jquery html

【解决方案1】：

在纯 JavaScript 中

<form method="get" action="" id="search" onsubmit="return false;">
...
</form>

请注意，不会让您提交表单，因此理想情况下您会调用提交处理函数，您可以在其中控制何时要提交

<form method="get" action="" id="search" onsubmit="return mySubmitHandler()">
...
</form>

在您的提交处理程序中

        function mySubmitHandler(){
        if (submit_criteria_met) {
        return true;
        } else {
        return false;
        }
return false;

    }

【讨论】：

np。刚刚更正了提交处理程序伪代码。 onsubmit 应该有“return mySubmitHandler()”。

【解决方案2】：

这应该可以解决问题：

$('form#search').on('submit', function(e) {
    e.preventDefault();
});

重要的部分是e.preventDefault()，它在submit事件被触发时阻止表单提交。

【讨论】：

这不会阻止 onkeypress 处理程序在按下回车键时执行（键码 13）。看我的回答

【解决方案3】：

删除输入字段中的onkeypress 属性，当按下回车（键码13）时，它看起来像是在幕后发布了一些内容。

您可能还想阻止表单提交，尽管由于 action 属性为空，它似乎提交到同一页面。

如果您无法编辑 HTML，请尝试以下操作：

$('#search').submit(function(e) {
  e.preventDefault();
}).find('input[onkeypress]').removeAttr('onkeypress');

测试：http://jsfiddle.net/DAvfm/

【讨论】：

【解决方案4】：

防止表单的默认动作。

$('#search').submit(function(event) { event.preventDefault(); });

【讨论】：

【解决方案5】：

$('#search').bind('submit',function(e) {
    e.preventDefault();
});

【讨论】：

这将无济于事:)
如果您使用 get 方法，那么在您的表单中，您为什么不摆脱表单并将其作为 URL 发布？无论如何，它无论如何都不会受益。
哎呀！我没有阻止错字:)
是的，没用。感谢 Abhi，它是一个复杂的 ajax/mysql 搜索，我认为实现所需结果的最佳方法是防止提交