在继续循环之前用值更新页面

我创建了一些代码,可以向上或向下舍入输入的数字,具体取决于整数是偶数还是奇数。我已经解决了这个问题,但是现在我想将我的代码放入一个循环中,该循环将不断提示用户输入另一个数字,直到他们输入像“x”这样的值。


我想要发生的是页面在再次提示用户之前使用计算值更新。我还无法弄清楚如何做到这一点,因此我的问题在这里。


有没有办法做到这一点,还是我的做法都错了?


Javascript:


function main() {

    var n = prompt("Enter A Number\nCan Be A Whole Number Or Decimal Number With One Decimal Place.\nOr Enter x To Exit.");

        while (n != "x") {

            var nn = 0

            if (n.includes(".")) {

                var n = parseFloat(n);

                q = Math.trunc(n);

                if (q % 5 == 0) {

                    if ((n % 1) >= 0.5) {

                        nn = (Math.ceil(n));

                    } else if ((n % 1) < 0.5) {

                        nn = (Math.floor(n));

                    }

                } else {

                    if ((n % 1) <= 0.5) {

                        nn = (Math.floor(n));

                    } else if ((n % 1) > 0.5) {

                        nn = (Math.ceil(n));

                }

            }


            document.getElementById("orgNum").innerHTML = "Original Number: " + n;

            document.getElementById("roundNum").innerHTML = "Rounded Number: " + nn

            setTimeout(main, 5000);

        } else {

            document.getElementById("orgNum").innerHTML = "Original Number: " + n;

            document.getElementById("roundNum").innerHTML = "Rounded Number: Whole Number Was Entered."

            setTimeout(main, 5000);



    }

    setTimeout(main, 5000);

    var n = prompt("Enter Another Number\nCan Be A Whole Number Or Decimal Number With One Decimal Place.\nOr Enter x To Exit.")


    }

}


HTML:


<div id="wrapper">

    <div id="dataEntry">

        <input type="button" id="subButton" value="Begin" onClick="main()">

    </div>

    <div id="dataPrint">

        <p id="orgNum">Original Number: </p>

        <p id="roundNum">Rounded Number: </p>

    </div>

</div>

我在这里缺少什么?


任何帮助将不胜感激。


人到中年有点甜
浏览 186回答 1
1回答

翻阅古今

浏览器中的 Javascript 与 ui 一起在单个线程中运行。使用循环接管该线程,正如您的代码尝试执行的那样,将阻止 ui 运行,包括允许用户在输入中输入文本。您需要使用事件侦听器,而不是您的 while 循环。您可以将 onkeyup 事件侦听器附加到您的输入,它会查找输入键(键码 13),或者将您的输入放入一个表单并将 onsubmit 事件侦听器附加到该表单。此事件侦听器将在输入字段中查找“x”字符:如果找到,则完成(您可以隐藏输入和/或在页面上放置一条消息,指示不再需要输入)。如果找不到 x,请进行四舍五入并清除输入值。完成舍入/清除后,用户将能够输入另一个值,按 Enter 键,这将再次触发事件侦听器,依此类推,直到检测到“x”。
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript