gpt4 book ai didi

javascript - 为什么手动更改输入值不能发出输入事件?

转载 作者:行者123 更新时间:2023-11-30 21:03:25 25 4
gpt4 key购买 nike

代码在attachment中定义

我有一个情况,我有一个输入字段和附加到该字段的输入事件。

当我在这个字段中写入、删除等时,事件会正确发出,我可以对此事件使用react。

input.addEventListener('input', () => {
changeCounterValue(charsCounter, input);
});

但是当我提交带有输入的表单时,我重置了输入的值,但它实际上并没有触发我的输入事件。

document.querySelector('form').addEventListener('submit', (e) => {
e.preventDefault();
input.value = "";
// I don't want to integrate here with charsCounter module, to reset his value to 0
});

我的目标是在不集成到 charsCounter 模块的情况下重置 charsCounter 的值,因为在我提交表单的这一刻,charsCounter 不会重置为 0。

最佳答案

在本地,正如@Temani Afif 在评论中所述,input 事件不会由 Javascript 的更改触发。相反,您必须在重置您的值后自行发送它。像这样创建元素:

 var inputEvent = new Event('input', {
view: window,
bubbles: true,
cancelable: true
});

然后在您的提交 EventListener 中触发它,如下所示:

document.querySelector('form').addEventListener('submit', (e) => {
e.preventDefault();
input.value = "";
// I don't want to integrate here with charsCounter module, to reset his value to 0
input.dispatchEvent(inputEvent);
});

JSFiddle

欲了解更多信息,请访问 MDN - Creating and triggering Events

关于javascript - 为什么手动更改输入值不能发出输入事件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46886223/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com