使用原生javascript停止表单提交

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准备好处理,所以元素可用.

小提琴