Question

您好我正试图让小费计算器显示在警告框中我正在努力让代码工作并获取警报框并显示并获得正确的计算。我希望它首先在警报框中显示账单的总成本，然后根据前者对服务进行评级。差 - 8％公平 - 10美元 - 15％和20％优秀。如果有人能帮我这个谢谢。链接：http://jsfiddle.net/saber2356/wxy9zfn8/

的javascript：

<html>
    <head>
    <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
    <meta content="utf-8" http-equiv="encoding">
    <title>tip</title>
    <script type="text/javascript">

    function calculateTip()
    {
        var bill, tip, answer;

        bill = document.TipCalculator.bill.value - 0;
        tip = document.TipCalculator.tip.value - 0;



        var cal= tip;
        if ("poor") { Math.round(((8/100) * bill)*100)/100;
        }else if ("fair"){ Math.round(((10/100) * bill)*100)/100;
        }else if ("good"){ Math.round(((15/100) * bill)*100)/100;
        }else ("excellent");{ Math.round(((20/100) * bill))*100/100;
        }




        bill = Math.round((bill + tip)*100)/100;




        document.TipCalculator.answer.value = bill;
        document.TipCalculator.Total.value = Total;

    }
    </script>
    </head>
    <body>
    <h1>Tip Calculator</h1>

    <script>function myFunction(){
    var calculateTip = prompt("Amount of Bill: ");}
    if (!number)){ alert ("Sorry cost " " must be a number"); }

    }else {("Rate your service as either: Poor, Fair, Good or Excellent ");}

    }else if {("Final Total = ")}

    </script>

</body>

Answer 1

Calummm的答案是正确的，无法真正改进，但它提到了一些更好的方法，所以我会在这里提出一些建议。

JSFiddle

一个是分离＆＃34;设置＆＃34;从你的其余代码。通常，您的HTML对此有好处。以下为百分比的下拉列表：

<select id="service" onchange="valueChange()">
  <option id="poor" value="8">Poor</option>
  <option id="fair" value="10">Fair</option>
  <option id="good" value="15">Good</option>
  <option id="excellent" value="25">Excellent</option>
</select>

如果我们正确使用我们的卡片，我们就可以在这里添加或删除选项，例如可能是＆＃34;杰出的＆＃34; 30％或者＃34;可怕的＆＃34;使用1％，然后在我们的代码中不做任何其他更改。 JavaScript会选择这些更改并与它们一起使用。

我们会对待＆＃34; bill＆＃34;作为输入......在这种情况下只是一个数字框。

<input type="number" id="bill" onchange="valueChange()" onkeyup="valueChange()"/>

然后我们会在某些地方吐出结果：

<h2>Tip</h2>
<h3 id="tip">0.00</h3>

<h2>Total</h2>
<h3 id="total">0.00</h3>

现在我们需要一个简单的数学函数，只需要两个数字并吐出尖端，仅此而已。

function calculateTip(percent, bill){
  return parseFloat((percent * bill / 100), 2);
}

现在我们需要将输入/输出与功能结合起来。这个函数由上面的HTML中的事件处理程序调用。

function valueChange(){

  //input
  var percent = parseInt(document.getElementById("service").value);
  var bill = parseInt(document.getElementById("bill").value);

  //the raw math
  var tip = calculateTip(percent, bill);
  var total = tip + bill;

  //output
  document.getElementById("tip").innerHTML = tip;
  document.getElementById("total").innerHTML = total;
}

Answer 2

我不确定你在问什么，如果我误解了，请告诉我。

有更好的方法来做你想做的事情，而不是使用警告框和提示，但如果你必须使用它们试试这个：

＆＃13;

function calculateTip (bill) {
    var rating, tip, answer;

    if (isNaN(bill)) {
        alert("Sorry cost must be a number"); 
        return;
    }      

    rating = prompt("Rate your service as either: Poor, Fair, Good or Excellent", "");
                
    if (rating === "poor") { 
        tip = Math.round(((8/100) * bill)*100)/100;
        
    } else if (rating === "fair") { 
        tip = Math.round(((10/100) * bill)*100)/100;
        
    } else if (rating === "good") { 
        tip = Math.round(((15/100) * bill)*100)/100;
        
    } else if (rating === "excellent") { 
        tip = Math.round(((20/100) * bill))*100/100;
      
    } else {
      alert("Sorry, you rated wrong");
      return;
    }

    bill = Math.round((bill + tip)*100)/100;

    alert("Your tip is: " + tip);
    alert("Your total is: " + bill);
}

calculateTip(prompt("Amount of Bill: ", 0));

＆＃13;

<h1>Tip Calculator</h1>

＆＃13;

比这更好的方法是使用表单元素。如果你想看到这个答案，请告诉我。

警报框提示计算器

2 个答案: