结果显示在新窗口中

Question

我创建了一个计算总和值的按钮。计算后我想在新窗口中显示我的结果，如弹出窗口.along与下拉框中的其他选定值。这是我的代码。

 function CalCost(a)
   {
       var area = a;

             var Total_Cost = 0;

             var max = 100;

                 if(a == 1)
                 {
                       J = 40;
                       D = 15;
                       E = 900;
                       P = 75;
                       L = 50;
                       E = 5;
                       M = 16;
                       Pi =8;
                       Pr = 34;
                       Ir = 52;
                       W = 42;
                       RK = 25;
                       Sp = 7;
                      Total_Cost = J+D+E+P+L+E+M+Pi+Pr+Ir+W+RK+Sp;
                 }                 
         }

Answer 1

有多种方法可以做到这一点，我也认为你正在寻找一个新的窗口，而不是一个模态或弹出窗口。为此，您可以使用window.open＆amp;更新那里的值

var win = window.open();
win.document.write(Total_Cost);

DEMO

修改

首先为模态创建一个dom

<div id="myModal" class="modal">

  <!-- Modal content -->
  <div class="modal-content">
    <span class="close">&times;</span>
    <p id ='calValue'></p> // calculated value will be show here
  </div>

</div>

<强> JS

// Get the button that opens the modal
var btn = document.getElementById("myBtn");

// Get the <span> element that closes the modal
var span = document.getElementsByClassName("close")[0];

// When the user clicks on the button, open the modal 
btn.onclick = function() {
    modal.style.display = "block";
}
// When the user clicks on <span> (x), close the modal
span.onclick = function() {
    modal.style.display = "none";
}

// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
    if (event.target == modal) {
        modal.style.display = "none";
    }
}

检查演示here

Answer 2

在HTML中保留一个隐藏的div并将绝对位置设置为div，使用JavaScript＆＃34; style.display＆＃34;单击显示/隐藏它属性。

显示div使用

document.getElementById("myDIV").style.display = "";

隐藏div

document.getElementById("myDIV").style.display = "none";

或者您可以使用JQuery对话框https://jqueryui.com/dialog/#animated