第五章 表單的制作
P83單行文字欄字段
<!--c5_2_l.htm-->
<html>
<head>
<title>文字欄與密碼欄</title>
</head>
<body>
<form>
請輸入你的賬號與密碼:<p>
賬號:<input type="text" name="txtAccount" size="20"><br>
密碼:<input type="password" name="txtPassword" size="20" maxlength="6">
</form>
</body>
</html>
P84選項(xiàng)鈕字段
<!--c5_3_l.htm-->
<html>
<head>
<title>問卷調(diào)查</title>
</head>
<body>
<form>
<p>請問您的性別是:</p>
<input type="radio" name="radSex" value="male" checked>男
<input type="radio" name="radSex" value=" female">女
<p>請問您贊成周休二日嗎?</p>
<input type="radio" name="radYN" value="YES" checked>贊成<br>
<input type="radio" name="radYN" value="NO">反對<br>
<input type="radio" name="radYN" value="NA" disabled>無意見<br>
</form>
</body>
</html>
P86復(fù)選框字段
<!--c5_4_l.htm-->
<html>
<head>
<title>你最喜歡的球類</title>
</head>
<body>
<p>你最喜歡的運(yùn)動是(可復(fù)選):</p>
<form>
<input type="checkbox" name="chkBasketball" value="ON">籃球
<input type="checkbox" name="chkBaseball" value="ON" checked>棒球
<input type="checkbox" name="chkPingpong" value="ON">桌球<br>
<input type="checkbox" name="chkSwim" value="ON" disabled>游泳
</form>
</body>
</html>
<!--c5_4_2.htm-->
<html>
<head>
<title>你最喜歡的運(yùn)動是</title>
</head>
<body>
<p>你最喜歡的運(yùn)動是(可復(fù)選):</p>
<form>
<input type="checkbox" name="chkGames" value="ON">籃球
<input type="checkbox" name="chkGames" value="ON” checked>棒球
<input type="checkbox" name="chkGames" value="ON">桌球<br>
<input type="checkbox" name="chkGames" value="ON" disabled>游泳
</form>
</body>
</html>
P88下拉式清單字段<SELECT>標(biāo)記
<!--c5_5_l.htm-->
<html>
<head>
<title>千禧年新好男人票選</title>
</head>
<body>
=====你最喜愛的歌星(單選):<br>
<form>
<select size="1" name="selstar1”>
<option value="周華健" selected>周華健</option>
<option value="吳宗憲”>吳宗憲</option>
<option value="蘇永康”>蘇永康</option>
<option value=“劉德華”>劉德華</option>
</select>
</form>
<p>
*****最受歡迎影星(可復(fù)選):<br>
<form>
<select size="3” name="selstar2" multiple>
<option value="周星馳”>周星馳</option>
<option value="成龍" selected>成龍</option>
<option value="梁家輝”>梁家輝</option>
<option value="梁朝偉”>梁朝偉</option>
<option value="張學(xué)友”>張學(xué)友</option>
</select>
</form>
</body>
</html>
P90多行文字欄字段<TEXTAREA>標(biāo)記
<!--c5_6_l.htm-->
<html>
<head>
<title>請輸入您的留言</title>
</head>
<body>
<form>
請輸入您的留言:<br>
<textarea rows="3” name="txt1” cols="40" wrap=off></textarea><p>
請輸入您的建議:<br>
<textarea rows="3” name="txt2" cols="40"></textarea>
</form>
</body>
</html>
P92按鈕字段
<!--c5_7_l.htm-->
<html>
<head>
<title>文字方塊與密碼方塊</title>
</head>
<body>
<form>
請輸入您的姓名與興趣:<p>
姓名:<input type="text" name="txtName" size="20"><br>
興趣:<input type="text" name="txtInterest" size="20"><br><br>
<input type="submit" value="傳送數(shù)據(jù)” name="btnSubmit">
<input type="reset" value="重填數(shù)據(jù)” name="btnReset">
<input type="button" value="檢查數(shù)據(jù)” name="btnCheck">
</form>
</body>
</html>
P94字段外框標(biāo)記:<FIELDSET>、<LEGEND>標(biāo)記
<!--c5_8_l.htm-->
<html>
<head>
<title>個人基本數(shù)據(jù)姓名</title>
</head>
<body>
<form>
<fieldset>
<legend>個人基本數(shù)據(jù)</legend>
姓名:<input type="text" name="txtName" size="20"><br>
性別:<input type="radio" value="女” checked name="radSex">女
<input type="radio" name="radSex" value="男”>男<br>
電話:<input type="text" name="txtTel" size="20"><br>
住址:<input type="text" name="txtAdd" size="20"><br>
Mail:<input type="text" name="txtMail" size="20"><br>
職業(yè):<select size=" 1” name="selWord">
<option selected>農(nóng)</option>
<option>工</option>
<option>商</option>
</select><br>
</fieldset>
<fieldset>
<legend>興趣</legend>
<input type="checkbox" name="chkGames" value="籃球”>籃球
<input type="checkbox" name="chkGames" value="電影”>電影
<input type="checkbox" name="chkGames" value="逛街” checked>逛街<br>
</fieldset> <br>
<input type="submit" value="提 交" name="btnSubmit">
<input type="reset" value=“重新設(shè)定” name="btnReset">
</form>
</body>
</html>
P96表單字段的只讀與失效功能
<!--c5_9_l.htm-->
<html>
<head>
<title>使用者賬號修改</title>
</head>
<body>
<p>使用者賬號修改:</p>
<form>
賬號:<input type="text" readonly name="txtName" value="RYO"><br>
密碼:<input type="password" name="txtPassword"><br>
等級:<select disabled name="selOrder">
<option value=1>1</option>
<option value=2>2</option>
<option value=3>3</option>
<option value=4>4</option>
</select><br>
權(quán)限:<input type="checkbox" name="chkpower" value="1”>建立賬號
<input type="checkbox" name="chkpower" value="2">刪除賬號
<input type="checkbox" name="chkpower" value="3" disabled>修改自己的數(shù)據(jù)
<br><br>
<input type="submit" value="提 交" name="butSubmit">
<input type="reset" value="重新設(shè)定” name="butReset"></p>
</form>
</body>
</html>