我正在使用货币转换器。如果点击任何货币代码按钮,将显示相应国家/地区和货币的名称。并列出1个单位(默认值)的港币金额。但是使用 textContent 方法无效。
<!doctype html>
<html>
<head>
</head>
<body>
<form name='Cuurency Converter' cellspacing='0' cellpadding='3'align='center'>
<table border='1'align='center'>
<tr>
<th colspan='6' align='center'><font size='6'><b>Currency Converter</b></font></th>
</tr>
<tr>
<td align=''center><input type='button' value='USD' id='USD' size='6' onclick='funUSD()'/> </td> <!-- Function will be called once when the button is clicked. -->
<td align=''center><input type='button' value='GBP' id='GBP'size='6' onclick='funGBP()'/> </td>
<td align=''center><input type='button' value='AUD' id='AUD' size='6'onclick='funAUD()'/> </td>
<td align=''center><input type='button' value='EUR' id='EUR'size='6' onclick='funEUR()'/> </td>
<td align=''center><input type='button' value='CAD' id='CAD' size='6'onclick='funCAD()'/> </td>
<td align=''center><input type='button' value='JPY' id='JPY' size='6'onclick='funJPY()'/> </td>
</tr>
<tr>
<td align=''center><input type='button' value='CNY' id='USD' size='6' onclick='funCNY()'/> </td> <!-- Function will be called once when the button is clicked. -->
<td align=''center><input type='button' value='THB' id='GBP'size='6' onclick='funTHB()'/> </td>
<td align=''center><input type='button' value='NZD' id='AUD' size='6'onclick='funNZD()'/> </td>
<td align=''center><input type='button' value='CHF' id='EUR'size='6' onclick='funCHF()'/> </td>
<td align=''center><input type='button' value='SGD' id='CAD' size='6'onclick='funSGD()'/> </td>
<td align=''center><input type='reset' value='Reset' /> </td> <!-- all context inside of texboxs will be cleared when it is invoked. -->
</tr>
<tr>
<th colspan='6'>Country:<input type='text' id='Country' size='7'/>Cuurrency:<input type='text' id='Currency' size='7'/>
</th>
</tr>
<tr>
<th colspan='2'>Local<input type='text' size='7'id='localAmount'/></th>
<th colspan='2'><input type='button' id='equals'value='equals'/></th>
<th colspan='2'>HKD<input type='text' size='7'id='hkd'/></th>
</th>
</tr>
</tr>
</table>
</form>
<script>
var _textBox1,_textBox2,_textBox3,_textBox4;
function funUSD(){
document.getElementsById('Country').textContent='USA'
} //The name of corresponding countries and currency will be displayed
</script>
</body>
</html>
答案 0 :(得分:1)
您需要为.value = "__"
设置<input>
的值。但是,使用接受国家/地区作为变量的函数会更好,因为您只需要为所有国家/地区编写一次函数。请参阅下面的工作代码。它使用每个元素的country字段,这意味着我能够为每个国家/地区使用相同的onClick。除了这个问题,还有更有效的方法。
<!doctype html>
<script>
function funCountry(country) {
document.getElementById("Country").value = country;
}
</script>
<html>
<body>
<form name='Cuurency Converter' cellspacing='0' cellpadding='3'align='center'>
<table border='1'align='center'>
<tr>
<th colspan='6' align='center'><font size='6'><b>Currency Converter</b></font></th>
</tr>
<tr>
<td align=''center><input type='button' value='USD' id='USD' size='6' onclick='funCountry(value)'/> </td> <!-- Function will be called once when the button is clicked. -->
<td align=''center><input type='button' value='GBP' id='GBP'size='6' onclick='funCountry(value)'/> </td>
<td align=''center><input type='button' value='AUD' id='AUD' size='6'onclick='funCountry(value)'/> </td>
<td align=''center><input type='button' value='EUR' id='EUR'size='6' onclick='funCountry(value)'/> </td>
<td align=''center><input type='button' value='CAD' id='CAD' size='6'onclick='funCountry(value)'/> </td>
<td align=''center><input type='button' value='JPY' id='JPY' size='6'onclick='funCountry(value)'/> </td>
</tr>
<tr>
<td align=''center><input type='button' value='CNY' id='USD' size='6' onclick='funCountry(value)'/> </td> <!-- Function will be called once when the button is clicked. -->
<td align=''center><input type='button' value='THB' id='GBP'size='6' onclick='funCountry(value)'/> </td>
<td align=''center><input type='button' value='NZD' id='AUD' size='6'onclick='funCountry(value)'/> </td>
<td align=''center><input type='button' value='CHF' id='EUR'size='6' onclick='funCountry(value)'/> </td>
<td align=''center><input type='button' value='SGD' id='CAD' size='6'onclick='funCountry(value)'/> </td>
<td align=''center><input type='reset' value='Reset' /> </td> <!-- all context inside of texboxs will be cleared when it is invoked. -->
</tr>
<tr>
<th colspan='6'>Country:<input type='text' id='Country' size='7'/>Cuurrency:<input type='text' id='Currency' size='7'/>
</th>
</tr>
<tr>
<th colspan='2'>Local<input type='text' size='7'id='localAmount'/></th>
<th colspan='2'><input type='button' id='equals'value='equals'/></th>
<th colspan='2'>HKD<input type='text' size='7'id='hkd'/></th>
</tr>
</table>
</form>
</body>
</html>
&#13;
答案 1 :(得分:-1)
它是document.getElementById()
而不是document.getElementsById()
。
检查功能的拼写。 (ID是唯一的,所以getElementsById
中没有 s )