表单没有操作，其中输入不会重新加载页面

我正在寻找最简洁的方式来创建一个 HTML 表单，没有提交按钮。这本身很容易，但是我还需要在完成类似提交的事情(例如，在文本字段中按 Enter)时阻止表单重新加载自己。

146352 次浏览
小开
最佳答案

向表单添加一个 oncommit 处理程序(通过普通 js 或 jquery $())。提交(fn) ，并返回假，除非您的具体条件得到满足。

除非您不希望表单提交，否则——在这种情况下，为什么不在表单元素中省略‘ action’属性呢？

小开

只需将此事件添加到您的文本字段。它将阻止按 Enter 键提交，您可以根据需要自由添加提交按钮或调用 form.mit () :

onKeyPress="if (event.which == 13) return false;"

例如:

<input id="txt" type="text" onKeyPress="if (event.which == 13) return false;"></input>
小开

您需要在表单中包含 action="javascript:void(0);"，以防止页面重新加载并维护 HTML 标准。

小开

一个想法:

<form method="POST" action="javascript:void(0);" onSubmit="CheckPassword()">
<input id="pwset" type="text" size="20" name='pwuser'><br><br>
<button type="button" onclick="CheckPassword()">Next</button>
</form>

还有

<script type="text/javascript">
$("#pwset").focus();
function CheckPassword()
{
inputtxt = $("#pwset").val();
//and now your code
$("#div1").load("next.php #div2");
return false;
}
</script>
小开

Two way to solve :

  1. form's action value is "javascript:void(0);".
  2. 为表单添加按键事件侦听器，以防止提交。
小开

The first response is the best solution:

向表单添加一个 oncommit 处理程序(通过普通 js 或 jquery) 提交(fn) ，并返回 false，除非您的具体条件是 遇见了。

使用 jquery 更具体:

$('#your-form-id').submit(function(){return false;});

除非您不希望表单提交，否则——在这种情况下，为什么 not just leave out the 'action' attribute on the form element?

编写 Chrome 扩展就是一个例子，你可能有一个用于用户输入的表单，但是你不想让它提交。如果使用 action = “ Javascript: void (0) ;”，代码可能会正常工作，但是最终会得到一个关于运行内联 Javascript 的错误 this problem。

如果你完全忽略了这个动作，表单会重新载入，这在某些情况下在编写 Chrome 扩展时也是不需要的。或者，如果你有一个内嵌计算器的网页，用户可以提供一些输入，然后点击“计算”或类似的东西。

小开

当你在表单中按回车键时，表单的自然行为将被提交，为了阻止这种不自然的行为，你必须阻止它提交(默认行为) ，使用 jquery:

$("#yourFormId").on("submit",function(event){event.preventDefault()})
小开

在事件侦听器中尝试 preventDefault()方法以提交此表单


提交答案