1 使用文本框
一些網站上有textbox上有自動選中的功能:
onfocus="document.form1.txt2.select()"
2 密碼框屬性
type="password" ,網頁上textbox裏面就是密碼形式輸入。
用password.value這個屬性則可以明文輸出密碼。
3 表單常見按鈕的屬性
這裏說一下單選框radio,設置2個radio,讓他們的name相同,這樣他們就屬於同一組,才能做到“單選”
<input type="radio" name="radio1" />male
<input type="radio" name="radio1" />female
4 表單中select標籤的簡單應用
這個select啊 我總是叫他Dropdownlist 囧
<select ><option></option>
<optgroup>
<option></option>
</optgroup>
</select>
5 select()全選和focus()焦點的區別:
οnclick="document.form1.text1.select()" 陰影全部選中
οnclick="document.form1.text2.focus()" 光標位置
具體代碼:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Js11.aspx.cs" Inherits="Javascript_Js11" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Javascript學習筆錄14(表單應用) </title>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="text" value="information" name="txt1" />
<input type="text" value="information1" name="txt2" οnfοcus="document.form1.txt2.select()" /><br />
<input type="text" value="information2" name="txt3" size="45" /><br />
<input type="button" name="btn1" value="panic button" οnclick="document.form1.txt3.value='sit down'" /><br />
<input type="password" name="pw1" value="daylight"><br />
<input type="checkbox" name="cb1" value="have name" checked="checked" />哈根達斯
<input type="radio" name="radio1" />male
<input type="radio" name="radio1" />female
<br />
<select name=select1 size=4>
<option name=option1 value=lon selected ="selected">london,England</option>
<option name=option2 value=dub>Dublin,Ireland</option>
<option>手機</option>
<option>座機</option>
<option>電子郵件</option>
</select>
<br />
興趣: <select multiple="multiple">
<optgroup label="球類">
<option>足球</option>
<option>籃球</option>
<option>羽毛球</option>
<option>乒乓球</option>
</optgroup>
<optgroup label="其他">
<option>游泳</option>
<option>健身</option>
</optgroup>
</select>
<br />
自我描述:<textarea row="4" cols="12" name="ta" οnchange="validate()"></textarea><br />
<input type="text" name="text1" value="where is you focus?"><br>
<input type="text" name="text2" value="is there?"><br>
<input type="text" name="text3" value="or maybe here?"><br>
<input type="button" name="button1" value="text box #1" οnclick="document.form1.text1.select()"><br>
<input type="button" name"button2" value="text box #2" οnclick="document.form1.text2.focus()"><br>
<input type="button" name="button3" value="text box #3" οnclick="document.form1.text3.focus()"><br>
</div>
</form>
</body>
</html>
<script >
document.write("表單text1類型是:"+document.form1.txt1.type+"</br>");
document.write("表單text1名稱是:"+document.form1.txt1.name+"</br>");
document.write("表單pw1的類型:"+document.form1.pw1.type+"<br>")
document.write("表單pw1的名稱:"+document.form1.pw1.name+"<br>")
document.write("表單pw1的值:"+document.form1.pw1.value+"<br>")
document.write("表單pw1的大小:"+document.form1.pw1.size+"<br>")
document.write("表單cb1的類型:"+document.form1.cb1.type+"<br>")
document.write("表單cb1是否被選擇?:"+document.form1.cb1.checked+"<br>")
document.write("表單cb1的名稱:"+document.form1.cb1.name+"<br>")
document.write("表單cb1的值:"+document.form1.cb1.value+"</br>")
document.write("第一個按鈕被選擇"+document.form1.radio1[0].checked+"</br>")
document.write("第二個按鈕被選擇"+document.form1.radio1[1].checked+"</br>")
document.write("第一個按鈕的名稱"+document.form1.radio1[0].name+"</br>")
document.write("按鈕個數"+document.form1.radio1.length+"</br>")
document.write("這個選擇列表的名稱"+document.form1.select1.name+"<br>")
document.write("這個選擇列表的長度"+document.form1.select1.length+"<br>")
document.write("這個選擇列表當前被選擇的索引號"+document.form1.select1.selectedIndex+"<br>")
document.write("這個選擇列表的尺寸"+document.form1.select1.size+"<br>")
function validate()
{
if(document.form1.ta.value!='1'||'2')
{
alert("請輸入1 或2")
}
// if(ta.value!='1'||'2') js腳本中以document開始層層去找
// {
// alert("請輸入1 或2")
// }
}
</script>