javascript 获取表单元素的几种方法
Jun 01, 2016 am 09:55 AM第一种方法,通过元素的name获取
使用方法:
<code class="language-javascript">document.pref.color.value;//pref表示form表单的name,color是表单中元素的名称。</code>
实例:
<code class="language-html"> <script language="JavaScript"> function showColor(){ var color = document.pref.color.value; console.log("Your favorite color is: " + color); } </script> <form name="pref" method="POST"> Enter the name of your favorite car: <input type="text" name="car" size="25"> <input id="button1" type="BUTTON" name="carButton" value="Show Car" onclick="showCar(this.form)"> <br> Enter your favorite color: <input type="text" name="color" size="15"> <input type="BUTTON" name="colorButton" value="Show Color" onclick="showColor(this.form)"> </form> </code>
上面实例代码使用ocument.pref.color.value获取pref表单中name为color元素的值。
第二种方法:通过元素的index获取
使用方法:
<code class="language-javascript">document.pref.elements[0].value //表示name为pref表单中第一个元素的值</code>
实例:
<code class="language-html"> <script language="JavaScript"> function showCar(){ var car = document.pref.elements[0].value; console.log("Your favorite car is: " + car); } </script> <form name="pref" method="POST"> Enter the name of your favorite car: <input type="text" name="car" size="25"> <input id="button1" type="BUTTON" name="carButton" value="Show Car" onclick="showCar(this.form)"> <br> Enter your favorite color: <input type="text" name="color" size="15"> <input type="BUTTON" name="colorButton" value="Show Color" onclick="showColor(this.form)"> </form> </code>
此实例获取了表单中第一个元素的值,表单的第一个元素应该是name为car的input
第三种方法:通过元素的id获取
<code class="language-javascript">document.getElementById("id").value;</code>
实例:
<code class="language-html"> <script language="JavaScript"> function getName(){ var textName = document.getElementById("text_id").value; console.log("The textbox name is: " + textName); } </script> <form name="form1"> This is a blank input textbox. Click on the button below to get the name of the textbox. <br> <input type="text" id="text_id" name="textbox1" size="25"> <br><br> <input type="button" value="Get Name" onclick="getName()"> </form> </code>
使用document.getElementById("text_id")获取id为text_id的input.
注:本文章的实例代码均可复制到这里运行并查看结果,你不妨试一把。

Artikel Panas

Alat panas Tag

Artikel Panas

Tag artikel panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Di mana untuk mendapatkan kod keselamatan Google

Disyorkan: Projek pengesanan dan pengecaman muka sumber terbuka JS yang sangat baik

Alat penting untuk analisis saham: Ketahui langkah-langkah untuk melukis carta lilin dengan PHP dan JS

Petua Pembangunan PHP dan JS: Kuasai Kaedah Melukis Carta Lilin Stok

Cara membuat carta candlestick saham menggunakan PHP dan JS

Tutorial JavaScript Mudah: Cara Mendapatkan Kod Status HTTP

Bagaimana untuk memasang dua kad SIM pada Realme 12 Pro?

Petua untuk menggunakan kelas borang Laravel: cara untuk meningkatkan kecekapan
