在进行计算时显示消息javascript [英] display message javascript while a calculation is being made

问题描述

我一直在环顾四周，尽管看起来似乎非常简单.(移动开发)

I have been looking around and I cannot seem to figure out how to do this, although it seems like it would be very simple.(mobile development)

我要执行的操作是在进行计算时显示一条消息(有点像警报，而不是警报，更像是对话框).就像正在加载一样，请稍候.我希望消息出现并在计算完成后留在那里，然后将其删除.我只是似乎找不到适当的方法来完成此操作.

What I am trying to do is display a message (kind of like an alert, but not an alert, more like a dialog) while a calculation is being made. Simply like a Loading please wait. I want the message to appear and stay there while the calculation is being done and then be removed. I just cannot seem to find a proper way of doing this.

按下提交按钮，首先检查以确保所有表单均已填写，然后应显示消息，进行计算，然后隐藏消息.

The submit button is pressed and first checks to make sure all the forms are filled out then it should show the message, it does the calculation, then hides the message.

这是计算功能.

   function scpdResults(form) {
        //call all of the "choice" functions here
        //otherwise, when the page is refreshed, the pulldown might not match the variable
        //this shouldn't be a problem, but this is the defensive way to code it
        choiceVoltage(form);
        choiceMotorRatingVal(form);
        getMotorRatingType();
        getProduct();
        getConnection();
        getDisconnect();
        getDisclaimer();
        getMotorType();

        //restore these fields to their default values every time submit is clicked
        //this puts the results table into a known state
        //it is also used in error checking in the populateResults function
        document.getElementById('results').innerHTML = "Results:";
        document.getElementById('fuse_cb_sel').innerHTML = "Fuse/CB 1:";
        document.getElementById('fuse_cb_sel_2').innerHTML = "Fuse/CB 2:";
        document.getElementById('fuse_cb_result').innerHTML = "(result1)";
        document.getElementById('fuse_cb_res_2').innerHTML = "(result2)";
        document.getElementById('sccr_2').innerHTML = "<b>Fault Rating:</b>";
        document.getElementById('sccr_result').innerHTML = "(result)";
        document.getElementById('sccr_result_2').innerHTML = "(result)";
        document.getElementById('contactor_result').innerHTML = "(result)";
        document.getElementById('controller_result').innerHTML = "(result)";

        //Make sure something has been selected for each variable
        if (product === "Choose an Option." || product === "") {
            alert("You must select a value for every field.  Select a Value for Product");
        **************BLAH************
        } else {

            //valid entries, so jump to results table
            document.location.href = '#results_a';


    ******This is where the message should start being displayed***********

            document.getElementById('motor_result').innerHTML = motorRatingVal + " " + motorRatingType;
            document.getElementById('voltage_res_2').innerHTML = voltage + " V";
            document.getElementById('product_res_2').innerHTML = product;
            document.getElementById('connection_res_2').innerHTML = connection;
            document.getElementById('disconnect_res_2').innerHTML = disconnect;

            if (BLAH) {

            }
            else {

            }

            populateResults();
            document.getElementById('CalculatedResults').style.display = "block";

        } //end massive else statement that ensures all fields have values


*****Close out of the Loading message********
    } //scpd results

感谢大家的宝贵时间，

推荐答案

计算机速度很快.真快.大多数现代计算机每秒可以执行数十亿条指令.因此，我相当确定您可以依靠setTimeout函数在1000ms左右触发，足以显示加载消息.

Computers are fast. Really fast. Most modern computers can do several billion instructions per second. Therefore, I'm fairly certain you can rely on a a setTimeout function to fire around 1000ms to be sufficient to show a loading message.

if (product === "Choose an Option." || product === "") {
  /* ... */
} else {
  /* ... */
  var loader = document.getElementById('loader');
  loader.style.display = 'block';
  window.setTimeout(function() {
    loader.style.display = 'none';
    document.getElementById('CalculatedResults').style.display = "block";
  }, 1000);
}

<div id="loader" style="display: none;">Please wait while we calculate.</div>

这篇关于在进行计算时显示消息javascript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！