Javascript运送计算器未捕获输入_Javascript_Input_Calculator_Shipping

Javascript运送计算器未捕获输入

javascript input

Javascript运送计算器未捕获输入,javascript,input,calculator,shipping,Javascript,Input,Calculator,Shipping,我头痛得要命。我对Javascript不是很在行，所以我不知道发生了什么。我应该编写一个文本框，当输入并提交价格时，它将计算运费并告诉您总额。除了没有设置类型化的值之外，一切都正常。因此，无论输入什么，价格似乎都永久设置为NaN。我做错了什么？D: <!DOCTYPE html> <html> <head> <title>Untitled Document</title> </head> <body

我头痛得要命。我对Javascript不是很在行，所以我不知道发生了什么。我应该编写一个文本框，当输入并提交价格时，它将计算运费并告诉您总额。除了没有设置类型化的值之外，一切都正常。因此，无论输入什么，价格似乎都永久设置为NaN。我做错了什么？D:

<!DOCTYPE html>
<html>
  <head>
    <title>Untitled Document</title>
  </head>
  <body>
    <form method="post" name="number" onsubmit='window.alert("Your total is $" + total + ".");'>
      <input type="text" name="purchasePrice" placeholder="0.00" />
      <input type="submit" value="submit" />
    </form>
    <script>
      /* <![CDATA[ */
      var price = parseFloat(document.getElementsByTagName("input")[0].value);
      var shipping = parseFloat(calculateShipping(price));
      var total = price + shipping;
      function calculateShipping(price) {
        if (price <= 25) {
          return 1.5;
        } else {
          return price * 10 / 100
        }
      }
      /* ]]> */
    </script>
  </body>
</html>


无标题文件
/*  */

这是一个可能对您有所帮助的示例

<input id="amount" type="text" name="purchasePrice" placeholder="0.00" />
<input id="submit" type="submit" value="submit" />

var amount = document.getElementById("amount");
var submit = document.getElementById("submit");

function calculateShipping() {
    var price = parseFloat(amount.value) || 0;

    if (price <= 25) {
        alert("Your total is $" + 1.5);
    } else {
        alert("Your total is $" + (price * 10 / 100));
    }
}

submit.addEventListener("click", calculateShipping, false);


var金额=document.getElementById（“金额”）；
var submit=document.getElementById（“提交”）；
函数calculateShipping（）{
var价格=parseFloat（amount.value）| 0；
如果（价格这里有一个样品可以帮助你
<input id="amount" type="text" name="purchasePrice" placeholder="0.00" />
<input id="submit" type="submit" value="submit" />

var amount = document.getElementById("amount");
var submit = document.getElementById("submit");

function calculateShipping() {
    var price = parseFloat(amount.value) || 0;

    if (price <= 25) {
        alert("Your total is $" + 1.5);
    } else {
        alert("Your total is $" + (price * 10 / 100));
    }
}

submit.addEventListener("click", calculateShipping, false);


var金额=document.getElementById（“金额”）；
var submit=document.getElementById（“提交”）；
函数calculateShipping（）{
var价格=parseFloat（amount.value）| 0；
如果（priceJavaScript代码在知道price之前运行…那么任何*，+NaN就是…NaN
单击“提交”时，您应调用“总计计算”，例如。通过以下方式：
<!DOCTYPE html>
<html>
<head>
<title>Untitled Document</title>

</head>

 <body>

<form method="post" name="number" onsubmit='calculateTotal()'>
<input type="text" name="purchasePrice" placeholder="0.00" />
<input type="submit" value="submit" />
</form>

<script>
/* <![CDATA[ */

function calculateTotal() {
    var price = parseFloat(document.getElementsByTagName("input")[0].value);
    var shipping = parseFloat(calculateShipping(price));
    var total = price+shipping;

    window.alert("Your total is $" + total + ".");
}


function calculateShipping(price) {
    if (price <= 25) {
        return 1.5; }
    else {
        return price * 10/100 }
    }

/* ]]> */
 </script>

 </body>

 </html>


无标题文件
/*  */
JavaScript代码在知道价格之前运行…所以任何东西*，+NaN都是…NaN
单击“提交”时，您应调用“总计计算”，例如。通过以下方式：
<!DOCTYPE html>
<html>
<head>
<title>Untitled Document</title>

</head>

 <body>

<form method="post" name="number" onsubmit='calculateTotal()'>
<input type="text" name="purchasePrice" placeholder="0.00" />
<input type="submit" value="submit" />
</form>

<script>
/* <![CDATA[ */

function calculateTotal() {
    var price = parseFloat(document.getElementsByTagName("input")[0].value);
    var shipping = parseFloat(calculateShipping(price));
    var total = price+shipping;

    window.alert("Your total is $" + total + ".");
}


function calculateShipping(price) {
    if (price <= 25) {
        return 1.5; }
    else {
        return price * 10/100 }
    }

/* ]]> */
 </script>

 </body>

 </html>


无标题文件
/*  */
您需要附加一个在用户输入值时触发的事件处理程序
<form method="post" name="number" onsubmit='window.alert("Your total is $" + total + ".");'>
<label for="purchasePrice">Price:</label>
<input type="text" name="purchasePrice" id="purchasePrice" placeholder="0.00" />
<br>
<label for="shipping">Shipping:</label>
<input type="text" name="shipping" id="shipping" disabled>
<!-- <input type="submit" value="submit" /> -->
</form>

<script>
    var price;
    var shipping = parseFloat(calculateShipping(price));
    var total = price+shipping;

    function calculateShipping(price) {
        if (price <= 25) {
            return 1.5; }
        else {
            return price * 10/100;
        }
    }

    var pp = document.getElementById("purchasePrice");
    pp.onkeyup = function(e){
        price = calculateShipping(this.value);
        document.getElementById("shipping").value = price;
    };
</script>


价格：


航运：
var价格；
var shipping=parseFloat（计算shipping（价格））；
var总额=价格+运费；
函数计算发货（价格）{
if（price您需要附加一个事件处理程序，当用户输入值时触发
<form method="post" name="number" onsubmit='window.alert("Your total is $" + total + ".");'>
<label for="purchasePrice">Price:</label>
<input type="text" name="purchasePrice" id="purchasePrice" placeholder="0.00" />
<br>
<label for="shipping">Shipping:</label>
<input type="text" name="shipping" id="shipping" disabled>
<!-- <input type="submit" value="submit" /> -->
</form>

<script>
    var price;
    var shipping = parseFloat(calculateShipping(price));
    var total = price+shipping;

    function calculateShipping(price) {
        if (price <= 25) {
            return 1.5; }
        else {
            return price * 10/100;
        }
    }

    var pp = document.getElementById("purchasePrice");
    pp.onkeyup = function(e){
        price = calculateShipping(this.value);
        document.getElementById("shipping").value = price;
    };
</script>


价格：


航运：
var价格；
var shipping=parseFloat（计算shipping（价格））；
var总额=价格+运费；
函数计算发货（价格）{
如果（普莱斯·奥曼，非常感谢你，这很有效！我觉得没有这样做很可笑。这是一种快速而肮脏的解决方案：）如果你想认真学习js，试着用jQuery玩f.ex，比如@Ghodmode recommendedInline javascript是不好的做法。如果你想认真学习javascript，那么你需要学习javascript，然后根据经验决定第三方库（下划线、jQuery、协议、mootools、dojo等）的时间是合适的。@Xotic750我完全同意，这不是最好的做法。Ohman，非常感谢你，这很管用！我觉得没有这样做很可笑。这是一种快速而肮脏的解决方案：）如果你想认真学习js，试着用jQuery玩f.ex，比如@Ghodmode recommendedInline javascript是不好的做法。如果你想认真学习javascript，那么你需要学习javascript，然后根据经验决定第三方库（下划线、jQuery、协议、mootools、dojo等）的时间我完全同意，这不是最好的做法。