通过提交eventlistener停止表单提交 [英] Stop form submission with submit eventlistener

问题描述

我试图阻止使用submit eventlistener提交表单。我的匿名函数运行，但表单仍然提交，即使函数结束时返回false。

我是否犯了一些愚蠢的错误？ c $ c>< form id =highlight>
行：< input type =textname =rowsvalue =1id =rows>
列：< input type =textname =cellsvalue =1id =cells>
< input type =submitname =Submitvalue =Highlightid =Submit>
< / form>

< script>
var highlight_form = document.getElementById（'highlight'）;
highlight_form.addEventListener（'submit'，function（）{
alert（'hi'）;
return false;
}，false）;
< / script>

解决方案

我总是调用事件。对于我想取消事件的事件侦听器，以及返回 false 的preventDefault（）。这对我来说总是有效。

 < script> 
 var highlight_form = document.getElementById（'highlight'）; 
 
 highlight_form.addEventListener（'submit'，function（event）
 {
 event.preventDefault（）; 
 alert（'hi'）; 
返回false; 
 
}，false）; 
< / script> 
  

I'm trying to stop a form from submitting using the submit eventlistener. My anonymous function runs but the form still submits, even with return false at the end of the function. There are no JS errors being thrown.

Am I making some stupid mistake?

<form id="highlight">
    Row: <input type="text" name="rows" value="1" id="rows">
    Column: <input type="text" name="cells" value="1" id="cells">
    <input type="submit" name="Submit" value="Highlight" id="Submit">
</form>

<script>
var highlight_form = document.getElementById('highlight');
highlight_form.addEventListener('submit', function() {
        alert('hi');
    return false;
}, false);
</script>

解决方案

I always call event.preventDefault() on event listeners that I want to cancel the event for, as well as return false. This always works for me.

<script>
var highlight_form = document.getElementById('highlight');

highlight_form.addEventListener('submit', function(event)
{
    event.preventDefault();
    alert('hi');
    return false;

}, false);
</script>

这篇关于通过提交eventlistener停止表单提交的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！