Question

我需要通过原生javascript（不是jQuery）选择一个表单并阻止表单提交（preventDefault）。

诀窍是表单没有名称或ID，也不能分配一个。

我的HTML：

<div id="search">
    <form method="get">
        <input type="text" name="post"/>
        <input type="submit" value="Post">
    </form>
</div>

到目前为止，我已尝试使用document.forms[0]和document.getElementsByTagName("form")[0]来选择表单，但返回的值未定义。

另一种可能的解决方案是重置提交按钮的功能，但我也没有成功。

Answer 1

使用querySelector和事件监听器，它几乎就像jQuery

document.querySelector('#search form').addEventListener('submit', function(e) {
    e.preventDefault();
});

请注意，脚本必须在之后元素，或使用DOM就绪处理程序，因此元素可用。

FIDDLE

Answer 2

简单的方法是使用onsubmit事件处理程序

<script>
var submitHandler = function() {
  // your code
  return false;
}
</script>

<form method="get" onsubmit="return submitHandler()">....</form>

或更简单

<form onsubmit="return false;">

Answer 3

表单上的

只返回false。

e.g。 <form onsubmit="return false">

使用原生javascript停止表单提交

3 个答案: