尝试使用JavaScript使用addEventListener重用按钮

我正在尝试（重新）设置一个按钮，以便我的JavaScript可以监听它。该按钮在HTML代码中以id=“actionButton”和文本Receive开头。如果选择该选项，我将文本更改为确认，然后认为我正在再次执行addEventListener，但该按钮未激活（即不可单击）。作为JavaScript的一个noob，我没有设置重新激活确认按钮。谁能帮我一下吗

const form=document.getElementById（'myForm'）；
const cardCode=document.getElementById（'cardCode'）；
form.addEventListener（'submit'，e=>{
e、 预防默认值（）；
检查输入（）；
});
document.getElementById（'cancel'）。addEventListener（'click'，e=>{
window.location.replace（'index.html'）；
});
函数checkInputs（）{
//修剪以删除空白
const cardCodeValue=cardCode.value.trim（）；
如果（cardCodeValue==''）{
setErrorFor（cardCode，“请输入要兑换的有效代码”）；
}else if（cardCodeValue.length！==16）{
setErrorFor（cardCode，“该代码无效。请重试。如果该代码用于特定应用，请在该应用中兑换。了解更多信息。”）；
}否则{
/*setSuccessFor（cardCode）*/
setSuccessFor（cardCode，cardCodeValue.replace（/\D/g'）；
}
}
函数setErrorFor（输入、消息）{
const formControl=input.parentElement；
constsmall=formControl.querySelector（'small'）；
formControl.className='form control error'；
small.innerText=消息；
}
函数setSuccessFor（输入、消息）{
log（“input.parentElement是”+input.parentElement）；
const formControl=input.parentElement；
const small=formControl.querySelector（'form-control'）；
if（document.getElementById（'actionButton'）。innerHTML==='CONFIRM'）{
//将邮件转换为货币
const newMessage=new Intl.NumberFormat（'en-US'{
风格：“货币”，
货币：美元
}).格式（信息）；
formControl.className='form control'；
//document.getElementById（'actionButton'）。innerHTML='CONFIRM'；
formControl.innerText=“\n\n\n”+新消息+”已记入贷方。“；
}否则{
//将邮件转换为货币
const newMessage=new Intl.NumberFormat（'en-US'{
风格：“货币”，
货币：美元
}).格式（信息）；
formControl.className='form control'；
document.getElementById（'actionButton'）。innerHTML='CONFIRM'；
formControl.innerText=“\n\n\n代码有效。是否继续？”；
}
//formControl.innerText=“\n\n\n您将要向您的帐户添加“+newMessage+”；
}

兑换你的密码
信用代码
错误消息
取消
赎回

我只使用一个侦听器，并在那里管理操作，ej

let actionType = 'cancel';
const listener = () => {
   if(actionsType === 'cancel') {
   //manage cancel action ej
   cancelAction();
   } else if(actionType === 'CONFIRM') {
    // manage CONFIRM action 
    confirmAction();
}
};

listener

是您必须添加到按钮的唯一侦听器。然后，当您储存按钮的文本时，也更改

actionType

。ej

 document.getElementById('buttonId').innerHTML('CONFIRM');
 actionType = 'CONFIRM';

现在，当用户单击按钮时，将执行actionType var的操作。 希望能帮助你

---

注：我的英语说得不太好。

每当你使用

formControl.innerText

=something时，你基本上是在用文本替换

formControl

元素的整个子元素

这意味着您的

输入

元素将从html中删除

这就是为什么下次会出现错误

在代码中注释下面的行，然后进行尝试。它会起作用的。

---

formControl.innerText=“\n\n\n代码有效。是否继续？”

谢谢。你的解释很有帮助，帮助我理解。尽管我给出了您建议的行，但我仍然需要向用户返回一条状态消息，以便他们确认。关于如何做到这一点以及如何让确认按钮工作，有什么建议吗-谢天谢地。我确实发现，如果我使用“document.getElementById（'xxxx'）.value”，它将不会重置表单控件的整个子控件。谢谢。虽然它没有解决手头的问题，因为我没有听取消和确认（而不是赎回和确认），我将在未来使用你的技术。谢谢你，我不太了解你的问题，对不起，也许下一次，再见