Javascript 提交时只调用一次函数

Javascript 提交时只调用一次函数,javascript,html,addeventlistener,Javascript,Html,Addeventlistener,我正在尝试提交一个表单,在提交的同时,我调用了一个名为myOwnFun的函数,它会运行。但如果我长时间按enter键,表单提交会重复我不想要的操作 这是密码 <form class="user__answer-form"> <input type="text" name="useranswer" class="user__answer"> </form> 我只想在按enter键时运行此功能一次,即使按的时间更长。我需要多次提交表单。首先在脚本中使

我正在尝试提交一个表单,在提交的同时,我调用了一个名为
myOwnFun
的函数,它会运行。但如果我长时间按enter键,表单提交会重复我不想要的操作

这是密码

<form class="user__answer-form">
     <input type="text" name="useranswer" class="user__answer">
</form> 
我只想在按enter键时运行此功能一次,即使按的时间更长。我需要多次提交表单。

首先在脚本中使用
e.preventDefault()
方法,然后在代码中使用,这将禁用表单的默认功能并执行代码。

尝试以下操作:

const form = document.querySelector('.user__answer-form');
const formAnswer = document.querySelector('.user__answer');

formAnswer.focus();

form.addEventListener('submit', function(e) {
   e.preventDefault();
   myOwnFun();
});


function myOwnFun() {
 var executed = false;
    return function() {
        if (!executed) {
            executed = true;
            console.log('show text one time in one Enter')
        }
    };

}

您可以使用它:
form.removeEventListener(“提交”,您的函数)

我认为您必须将
函数(e)
更改为“真正的函数”才能使其工作

const form=document.querySelector('.user\u answer-form');
const formAnswer=document.querySelector('.user\u answer');
//创建一个计数器来跟踪按键事件
让计数=0;
formAnswer.focus();
表.addEventListener('submit',函数(e){
e、 预防默认值();
//仅当计数为0时调用函数
//ie是第一次按下回车键
//如果长时间按此键,计数>0
//此条件失败
如果(计数=1){
myOwnFun();
}    
});
//在窗体元素上按下任何键时激发
表.addEventListener('keydown',函数(e){
//用于跨浏览器兼容性
常数keyCode=e.which | | e.keyCode;
如果(键代码==13){
//如果按enter键,则更新计数
计数++;
}
});
//在窗体元素上释放键时激发
表.addEventListener('keyup',函数(e){
常数keyCode=e.which | | e.keyCode;
//如果释放回车键,则重置计数
如果(键代码==13){
计数=0
}
});
函数myOwnFun(){
log('一次输入一次显示文本');
}


作为一种“向它扔一个库/包”的解决方案,Lodash有一个
once
函数,它将函数限制为每页加载一次调用:。这可能有点过分,尤其是当你只需要在一行中使用它时,所以我建议将它作为最后的手段,即使你使用独立的软件包

我已经在addEventListener的函数中添加了e.preventDefault()。如果我第一次按Enter键,它会工作,但我需要多次按Enter键。
const form = document.querySelector('.user__answer-form');
const formAnswer = document.querySelector('.user__answer');

formAnswer.focus();

form.addEventListener('submit', function(e) {
   e.preventDefault();
   myOwnFun();
});


function myOwnFun() {
 var executed = false;
    return function() {
        if (!executed) {
            executed = true;
            console.log('show text one time in one Enter')
        }
    };

}