Question

我正在创建一个计算器，我编写了以下代码：

对于javascript：

function calculate() {
'use strict';
 var total;
 var quantity = document.getElementById('quantity').value;
 var price = document.getElementById('price').value;
 var tax = document.getElementById('tax').value;
 var discount = document.getElementById('discount').value;
 total = quantity*price;
 tax /= 100;
 tax++;
 total *= tax;
 tax = tax/100;
 tax = tax+1;
 total = total*tax;
 total -= discount;
 document.getElementById('total').value = total;
 return false;
 }
 function init() {
 'use strict';
 var theForm = document.getElementById('theForm');
 theForm.onsubmit = calculate;
 }
 window.onload=init;

对于html：

 <div><label for="quantity">Quantity</label><input type="number"
 name="quantity" id="quantity" value="1" min="1" required></div>

 <div><label for="price">Price Per Unit</label><input type="text"
 name="price" id="tax" value="1.00" required></div>

 <div><label for="tax">Tax Rate (%)</label><input type="text"
  name="tax" id="tax" value="0.0" required></div>

 <div><label for ="discount">Discount</label><input type="text"
  name="discount" id="discount" value="0.00" required></div>

 <div><label for="total">Total</label><input type="text" name="total"
 id="total" value="0.00"></div>

 <div><input type="submit" value="Calculate" id="submit"></div>

我已经将文件分别保存为shopping.js和shopping.html，但我不知道如何将代码互连在一起，这样当我点击shopping.html并打开浏览器时，计算器就能正常工作。 / p>

我试图通过使用脚本标记在html代码中包含javascript代码，但它不起作用。我读了一些文章，说你必须将它们保存在同一目录中，但我不明白。我把它们保存在我的桌面上的一个名为shopping的文件中，我需要一些帮助。

谢谢。

Answer 1

检查 here

价格的ID是“税”我认为只是错字。我也将输入类型sumbit更改为按钮。

代码：

window.onload = function() { // this loads your script when the page loads
    function calculate() {  
   'use strict';
    var total = 0;

    var quantity = document.getElementById('quantity').value;
    var price = document.getElementById('price').value;
    var tax = document.getElementById('tax').value;
    var discount = document.getElementById('discount').value;
    total = quantity * price;
    tax /= 100;
    tax++;
    total *= tax;
    tax = tax / 100;
    tax = tax + 1;
    total = total * tax;
    total -= discount;
    document.getElementById('total').value = total;
    return false;
    }
};

您可以将此代码添加到您的页面或通过外部文件调用它，然后您只需将其放在您的html代码<script src="shopping.js" type="text/javascript"></script>中。放入<head>或<body>代码。

Answer 2

如果它们位于同一目录中，您可以像这样调用HTML页面中的js文件：

<script src="shopping.js" type="text/javascript"></script>

如果它在一个文件夹中，你必须在src行中反映出来：foldername / filename

这是如何将外部js文件放入HTML文档中。但是，如果您将js代码直接放在HTML文档的脚本标记中并且仍然无法正常工作，那么代码就会出现问题。

无法将javascript代码连接到HTML代码

2 个答案: