Question

当前正在处理一个项目，是因为change事件监听器被触发，浏览器中的内容已更新。

 <html>
   <head>
   </head>
   <body>
       <input type="number" max="100" min="1" value="20" step="1" />
       <p>CHANGE THE SIZE OF THIS TEXT</p>
       <script>
        const input = document.querySelector("input");
        input.addEventListener("change", evt => {
            const p = document.querySelector("p");
            const { target } = evt;
            p.setAttribute("style", `font-size: ${target.value}px`);
        })
       </script>
   </body>
 </html>

问题是，假设我花了3秒钟更改输入元素的值，一切正常，如果我非常快地更改输入元素的值，效果就不会出现在{{1 }}（似乎异步事件在事件循环中同时执行）。因此，我想到了使用HTMLParagraphElement，但在网络工作者中，我们不允许使用webworkers或DOMElement。有什么办法可以让这些操作同时执行？

Answer 1

我假设您的意思是当您按住输入框内的向上/向下箭头时，按住按钮时文本不会改变大小。

问题实际上与并发无关，而与您选择听的事件有关。仅当元素失去焦点时（即在这种情况下，将鼠标放在上方），onChange才会触发。同时，当值更改时，oninput立即触发。因此，在这种情况下，您想监听oninput事件。

您将按照以下方式进行操作：https://codepen.io/rzrzrz/pen/GBgLYr

input.addEventListener("input", evt => { ... });

浏览器中的并行性

1 个答案: