Question

我是编程/编码新手，所以对大多数人来说这可能很容易。我应该创建一个用于重量转换的Web应用程序：从美元到日元以及从日语日元到美元。假设1美元= 112。57日元 -使用一个输入框 -使用下拉菜单选择要执行的转化 -这两个公式是：日元=美元* 112.57和美元=日元/112.57

这是我到目前为止得到的：

<!DOCTYPE html>
<html>
<head>
<script>
function convert()
{
var Dollars, Yen; //declare variables

//INPUT
if (inCurrency.value == "U.S Dollars to Yen") {x.value=Dollars}
else if (inCurrency.value == "Yen to U.S Dollars") {x.value=Yen}

//PROCESSING
Yen = Dollars * 112.57;
Dollars = Yen / 112.57;

//OUTPUT
spYen.innerHTML = Yen;
spDollars.innerHTML = Dollars;

}
</script>
<style>
.CCC {
font-family: Arial;
font-size: 12pt;
color: lightseagreen;
}

.DDD {
font-family: 'Times New Roman', Times, serif;
font-size: 12pt;
color: lawngreen;
}
</style>
</head>
<body>
<h2>Currency Converter</h2>
<span class="CCC">Select one:</span>

<select id="inCurrency">
<option>U.S Dollars to Yen</option>
<option>Yen to U.S Dollars</option>

</select><br />
<span style="color:deeppink">Enter amount </span><span id="x"></span><input 
type="text" /><br />

<i>
<span class="DDD">Dollars: </span><span id="spDollars"></span><br />
<span class="DDD">Yen: </span><span id="spYen"></span><br />

</i>

<input type="button" value="Convert Currency" onClick="convert()" />
<br />
<br />
<a href="Index.html">Home

</body>
</html>

This is what it looks like我遇到的问题是头部的实际编码。我不确定如何正确设置它，它是否执行方程式。我想知道是否有人可以提供帮助。谢谢。

Answer 1

这是获得所需结果的一种方法。我已经为您修复了HTML和Javascript。

直接尝试获取/设置id值是不正确的方法。

function convert()
{
var Dollars, Yen; //declare variables

//INPUT
var e = document.getElementById("inCurrency");
var inCurrency = e.options[e.selectedIndex].text;

var amount = document.getElementById("x").value;

//PROCESSING
if (inCurrency == "U.S Dollars to Yen")
{
  Dollars = amount;
  Yen = Dollars * 112.57;
}
else if (inCurrency == "Yen to U.S Dollars")
{
  Yen = amount;
  Dollars = Yen / 112.57;
}

//OUTPUT
document.getElementById("spYen").innerHTML = Yen;
document.getElementById("spDollars").innerHTML = Dollars;

}

.CCC {
font-family: Arial;
font-size: 12pt;
color: lightseagreen;
}

.DDD {
font-family: 'Times New Roman', Times, serif;
font-size: 12pt;
color: lawngreen;
}

<h2>Currency Converter</h2>
<span class="CCC">Select one:</span>

<select id="inCurrency">
<option>U.S Dollars to Yen</option>
<option>Yen to U.S Dollars</option>

</select><br />
<span style="color:deeppink">Enter amount </span><input id="x" type="text" /><br />

<i>
<span class="DDD">Dollars: </span><span id="spDollars"></span><br />
<span class="DDD">Yen: </span><span id="spYen"></span><br />

</i>

<input type="button" value="Convert Currency" onClick="convert()" />
<br />
<br />
<a href="Index.html">Home

Answer 2

function convert()
{
   convertRule = document.querySelector("#inCurrency").value;
   amount = document.querySelector("#amount").value;
   if (inCurrency.value == "U.S Dollars to Yen"){
      Yen = amount * 112.57;
      document.getElementById("spDollars").innerHTML = Yen
   }else{
      Dollars = amount * 122.22;
      document.getElementById("spDollars").innerHTML = Dollars
  }
}

有关等式和条件的简单HTML / JavaScript问题

2 个答案: