如何更改文本框的值?

时间:2017-03-09 03:33:00

标签: javascript

我正在使用货币转换器。如果点击任何货币代码按钮,将显示相应国家/地区和货币的名称。并列出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>

2 个答案:

答案 0 :(得分:1)

您需要为.value = "__"设置<input>的值。但是,使用接受国家/地区作为变量的函数会更好,因为您只需要为所有国家/地区编写一次函数。请参阅下面的工作代码。它使用每个元素的country字段,这意味着我能够为每个国家/地区使用相同的onClick。除了这个问题,还有更有效的方法。

&#13;
&#13;
<!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;
&#13;
&#13;

答案 1 :(得分:-1)

它是document.getElementById()而不是document.getElementsById()

检查功能的拼写。 (ID是唯一的,所以getElementsById中没有 s