html中的货币价格转换

Currency price conversion in html

本文关键字:转换 货币 html      更新时间:2023-09-26

我有一个包含价格的html表格。我想要一个选择标签,使用它可以选择显示价格的货币。

选择货币

<select>
    <option value="1.">usd</option>
    <option value="1.3">euro</option>
</select>
<table>
    <tr><td>Item</td><td>Price</td></tr>
    <tr><td>Watches</td><td>100</td></tr>
    <tr><td>Bike</td><td>200</td></tr>
</table>

我基本上想要一个代码,当选择欧元时,它会将所有美元价格乘以1.3,并在表中替换它。

我有一种感觉,应该使用Java脚本来完成,但不知道怎么做。如果有人能帮忙的话,我会非常感激的。

您应该学习一些关于js和DOM的知识。

首先在您选择的上添加onchange事件

<select onchange="switch_currency(this.value);">

第二步在你的表上添加一个id

<table id="table_price">

然后使用js如下

<script>
  var switch_currency = function(currency) {
    var table = document.getElementById("table_price");
    for (var i = 1; i < table.children[0].children.length; i++) {
      var td = table.children[0].children[i].children[1];
      td.innerHTML *= currency;
    }
  }
</script>

好的,假设您有一个id为usdollar的输入字段,并且您希望在提交时输入的金额乘以1.3。然后您可以使用JavaScript来完成此操作。

类似这样的东西:

<script type="text/javascript">
function multiply(){
  var field = document.getElementById('usdollar');
  field.value = parseInt(field.value) * 1.3;
}
</script>
<form onSubmit="multiply();">