當(dāng)前位置:軟件學(xué)堂 > 資訊首頁 > 網(wǎng)絡(luò)編程 > 編程其他 > JS代碼:控制兩個文本框只輸入其一

JS代碼:控制兩個文本框只輸入其一

2012/10/19 14:59:16作者:佚名來源:網(wǎng)絡(luò)

移動端

【實例名稱】

控制兩個文本框只輸入其一

【實例描述】

在進行頁面驗證的時候,為了確定注冊用戶的唯一性,一般都通過郵箱或者姓名判斷.但只能有一個判斷的條件,即要么郵箱唯一,要么姓名唯一。本例學(xué)習(xí)如何控制兩個文本框只有其中一個有值。
【實例代碼】

 

<html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>標(biāo)題頁</title> <SCRIPT LANGUAGE="JavaScript"> function checkFields() {     name = document.submitform.name.value;   //獲取姓名     email = document.submitform.email.value; //獲取郵箱     if ((name == "") && (email == "") ) {    //如果兩者都為空       alert("請輸入姓名和郵箱!");                 return false;     }    else       return true; } </script> </head> <body> <form  name=submitform onSubmit="return checkFields()">     名字和郵箱只需要輸入一個即可<br>     <br> <table border=0> <tr> <td align=center>名字</td><td> </td> <td align=center>Email</td></tr><tr> <td align=center><input type=text name=name value="" onFocus="document.submitform.email.value='';" size=10></td> <td align=center>或</td> <td align=center><input type=text name=email value="" onFocus="document.submitform.name.value='';" size=10></td> </tr> <tr> <td colspan=3 align=center><input type=submit value="提交"></td> </tr> </table> </form> </body> </html>

【運行效果】

運行效果

【難點剖析】

本例的重點在于文本框的“onfocus”事件,此事件在文本框獲得焦點時被觸發(fā)。當(dāng)文本框狀取焦點時,會將另個文本框的值清空,實現(xiàn)代碼為“document.submitform.email.value=""”。

【源碼下載】

本實例JS代碼下載

標(biāo)簽: 文本框  JS代碼