个人中心
gpt4 book ai didi

javascript - 如何使用提示修复循环中的访问 DOM

转载 作者：行者123 更新时间：2023-11-30 14:06:23 25 4
gpt4 key购买 nike

在提示消息中，我请求一个数字，我想更新 DOM 元素(输入)，但仅在 do 时工作 - while 结束时，我想在每次提示消息后更新 DOM。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Odds and Evens Game</title>


</head>

<body>
    <form>
        Number: <input type="text" id="number">
        <input type="button" onclick="showIt()" value="ShowIt"> 
    </form>


<script>
       function showIt(){
 var inputval ;

        do {
        inputval = prompt('Enter a number between 1 and 5 , 999 to exit');
        number = parseInt(inputval);

        document.getElementById('number').value= number;

        }while(number !== 999); 
}
    </script>
</body>

</html>

正在运行的示例: https://jsfiddle.net/neossoftware/73ag8whd/4/

最佳答案

提示 窗口阻止用户访问程序界面的其余部分，直到对话框关闭。您的 while 循环一次又一次地调用提示阻止对用户界面的访问。

使用 await，在调用第二个提示之前绘制窗口。

let num = 0;
let ele = document.querySelector('#num');

(async () => {
    do {
        await getInput()
        ele.value = num;
        await sleep(0);
    } while(num !== 999);
})();

function sleep(ms) {
    return new Promise(resolve => {
        setTimeout(resolve, ms);
    })
}

function getInput() {
    return new Promise(resolve => {
        num = Number(prompt("Enter num"));
        resolve(num);
    });
}
Number: <input type="text" id="num">

关于javascript - 如何使用提示修复循环中的访问 DOM，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55310262/

25 4 0
文章推荐： c# - 是否允许在另一个泛型方法中调用泛型方法？
文章推荐： javascript - 在 Array push() 方法之后解决 Promise 或添加回调
文章推荐： ios - Swift - 使用 IB 的文本字段的自定义 inputView？
文章推荐： javascript - 如何创建异步方法的同步版本？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com