根据HTML表格中显示的价格计算税金

时间:2013-05-10 00:49:12

标签: javascript html calculated-field

我正在尝试在产品页面上显示价格含税。价格显示在[OurPrice]中,因此我需要拉出显示的价格(例如0.95英镑),乘以1.2倍,并以磅为单位显示价格。这是我尝试使用的代码,但是,它不显示计算的价格。我想用数字前面的£符号来表示。

    <table cellspacing="1" cellpadding="0" border="0" >
  <tbody><tr>
    <td class="retail-price" valign="top" nowrap="">[RetailPriceTitle]</td>
    <td width="100%">[RetailPrice]</td>
  </tr><tr>
    <td class="our-price" valign="top" nowrap="">Our Price:</td>
    <td width="100%"><span id="op">[OurPrice]</span></td>
  </tr>
  <tr>
    <td class="incvat" valign="top" nowrap="">Inc Vat</td>
    <td class="incvat">

<script type="text/jscript">
var ours = document.getElementById("op").value;
  document.write (£(ours *1.2))

    </script>
</td>
  </tr>

  </tbody>
</table>

3 个答案:

答案 0 :(得分:1)

这不是语法上有效的javascript。尝试这样的事情:

var ourPrice = document.getElementById("op").innerHTML; // fetch the price
ourPrice = ourPrice.replace('£', ''); // remove pound character
ourPrice = parseFloat(ourPrice); // convert price from a string to a number
var incVat = ourPrice * 1.2; // calculate the price with tax
document.write('£' + incVat); // write the result

http://jsfiddle.net/RjWMK/


但是,此代码还存在其他问题,这些问题本身就是其他主题,超出了本答案的范围。但作为一项研究活动:

  1. 请勿使用document.write()。而是运行一个脚本,在整个页面加载后找到该值,然后将值插入到正确节点的内容中。

  2. 使用number.toFixed(2)或货币格式库等方式正确格式化结果。

答案 1 :(得分:0)

根据Alex的回答,你需要像这样放

<td width="100%">£10.0</td>

答案 2 :(得分:0)

我要补充Alex Wayne已经说过的话。

我会把你的JS代码带到表格单元块外面,并在标签开始之前把它放在标题中。然后我将Alex的代码放入“window.onload = function(){// your code here}”块中,以便在页面加载后执行。

然后我没有使用“document.write()”,而是按照Alex的建议,将“document.write”行替换为另一行,将“incVat”值直接写入表格单元格。

将自定义ID提供给要打印值的表格单元格,例如“incvatValue”。

<td class="incvat" id="incvatValue"> </td>

然后,写下这行代码:

document.getElementById("incvatValue").innerHTML = incVat;

当你完成后,你的JS应该是这样的,它不应该在表格单元格内:

<script type="text/javascript">
window.onload = function(){
    var ourPrice = document.getElementById("op").innerHTML; // fetch the price
    ourPrice = ourPrice.replace('£', ''); // remove pound character
    ourPrice = parseFloat(ourPrice); // convert price from a string to a number
    var incVat = ourPrice * 1.2; // calculate the price with tax
    document.getElementById("incvatValue").innerHTML = incVat; // write the result
}
</script>

<td class="incvat" id="incvatValue"> </td>

顺便说一句,您可以将“incvatValue”替换为任何内容,只需确保表格单元格中的ID与JS中调用的ID匹配。