JavaBird 2012-12-22 17:35 鍙戣〃璇勮

Input琛ㄧずForm琛ㄥ崟涓殑涓€縐嶈緭鍏ュ璞★紝鍏跺張闅廡ype綾誨瀷鐨勪笉鍚岃€屽垎鏂囨湰杈撳叆妗嗭紝瀵嗙爜杈撳叆妗嗭紝鍗曢€?澶嶉€夋錛屾彁浜?閲嶇疆鎸夐挳絳夛紝涓嬮潰涓€涓€浠嬬粛銆?
1錛宼ype=text
杈撳叆綾誨瀷鏄痶ext錛岃繖鏄垜浠鐨勬渶澶氫篃鏄嬌鐢ㄦ渶澶氱殑錛屾瘮濡傜櫥闄嗚緭鍏ョ敤鎴峰悕錛屾敞鍐岃緭鍏ョ數璇濆彿鐮侊紝鐢靛瓙閭歡錛屽搴綇鍧€絳夌瓑銆傚綋鐒惰繖涔熸槸Input鐨勯粯璁ょ被鍨嬨€?
鍙傛暟name錛氬悓鏍鋒槸琛ㄧず鐨勮鏂囨湰杈撳叆妗嗗悕縐般€?
鍙傛暟size錛氳緭鍏ユ鐨勯暱搴﹀ぇ灝忋€?
鍙傛暟maxlength錛氳緭鍏ユ涓厑璁歌緭鍏ュ瓧絎︾殑鏈€澶ф暟銆?
鍙傛暟value錛氳緭鍏ユ涓殑榛樿鍊?
鐗規畩鍙傛暟readonly錛氳〃紺鴻妗嗕腑鍙兘鏄劇ず錛屼笉鑳芥坊鍔犱慨鏀廣€?/p>

<form>
your name:
<input type="text" name="yourname" size="30" maxlength="20" value="杈撳叆妗嗙殑闀垮害涓?0錛屽厑璁告渶澶у瓧絎︽暟涓?0"><br>
<input type="text" name="yourname" size="30" maxlength="20" readonly value="浣犲彧鑳借涓嶈兘淇敼">
</form>
2錛宼ype=password
涓嶇敤鎴戣錛屼竴鐪嬪氨鏄庣櫧鐨勫瘑鐮佽緭鍏ユ錛屾渶澶х殑鍖哄埆灝辨槸褰撳湪姝よ緭鍏ユ杈撳叆淇℃伅鏃舵樉紺轟負淇濆瘑瀛楃銆?
鍙傛暟鍜?#8220;type=text”鐩哥被浼箋€?
<form>
your password:
<input type="password" name="yourpwd" size="20" maxlength="15" value="123456">瀵嗙爜闀垮害灝忎簬15
</form>
3錛宼ype=file
褰撲綘鍦˙BS涓婁紶鍥劇墖錛屽湪EMAIL涓笂浼犻檮浠舵椂涓€瀹氬皯涓嶄簡鐨勪笢瑗匡細錛?
鎻愪緵浜嗕竴涓枃浠剁洰褰曡緭鍏ョ殑騫沖彴錛屽弬鏁版湁name錛宻ize銆?
<form>
your file:
<input type="file" name="yourfile" size="30">
</form>
4錛宼ype=hidden
闈炲父鍊煎緱娉ㄦ剰鐨勪竴涓紝閫氬父縐頒負闅愯棌鍩燂細濡傛灉涓€涓潪甯擱噸瑕佺殑淇℃伅闇€瑕佽鎻愪氦鍒頒笅涓€欏碉紝浣嗗張涓嶈兘鎴栬€呮棤娉曟槑紺虹殑鏃跺€欍€?
涓€鍙ヨ瘽錛屼綘鍦ㄩ〉闈腑鏄湅涓嶅埌hidden鍦ㄥ摢閲屻€傛渶鏈夌敤鐨勬槸hidden鐨勫€箋€?/p>

<form name="form1">
your hidden info here:
<input type="hidden" name="yourhiddeninfo" value="cnbruce.com">
</form>
<script>
alert("闅愯棌鍩熺殑鍊兼槸 "+document.form1.yourhiddeninfo.value)
</script>

5錛宼ype=button
鏍囧噯鐨勪竴windows椋庢牸鐨勬寜閽紝褰撶劧瑕佽鎸夐挳璺寵漿鍒版煇涓〉闈笂榪橀渶瑕佸姞鍏ュ啓JavaScript浠ｇ爜
<form name="form1">
your button:
<input type="button" name="yourhiddeninfo" value="Go錛孏o錛孏o錛? onclick="window.open('http://www.cnbruce.com')">
</form>

6錛宼ype=checkbox
澶氶€夋錛屽父瑙佷簬娉ㄥ唽鏃墮€夋嫨鐖卞ソ銆佹€ф牸銆佺瓑淇℃伅銆傚弬鏁版湁name,value鍙婄壒鍒弬鏁癱hecked錛堣〃紺洪粯璁ら€夋嫨錛?
鍏跺疄鏈€閲嶈鐨勮繕鏄痸alue鍊鹼紝鎻愪氦鍒板鐞嗛〉鐨勪篃灝辨槸value銆傦紙闄勶細name鍊煎彲浠ヤ笉涓€鏍鳳紝浣嗕笉鎺ㄨ崘銆傦級

<form name="form1">
a:<input type="checkbox" name="checkit" value="a" checked><br>
b:<input type="checkbox" name="checkit" value="b"><br>
c:<input type="checkbox" name="checkit" value="c"><br>
</form>
name鍊煎彲浠ヤ笉涓€鏍鳳紝浣嗕笉鎺ㄨ崘<br>
<form name="form1">
a:<input type="checkbox" name="checkit1" value="a" checked><br>
b:<input type="checkbox" name="checkit2" value="b"><br>
c:<input type="checkbox" name="checkit3" value="c"><br>
</form>

7錛宼ype=radio
鍗沖崟閫夋錛屽嚭鐜板湪澶氶€変竴鐨勯〉闈㈣瀹氫腑銆傚弬鏁板悓鏍鋒湁name,value鍙婄壒鍒弬鏁癱hecked.
涓嶅悓浜巆heckbox鐨勬槸錛宯ame鍊間竴瀹氳鐩稿悓錛屽惁鍒欏氨涓嶈兘澶氶€変竴銆傚綋鐒舵彁浜ゅ埌澶勭悊欏電殑涔熻繕鏄痸alue鍊箋€?/p>

<form name="form1">
a:<input type="radio" name="checkit" value="a" checked><br>
b:<input type="radio" name="checkit" value="b"><br>
c:<input type="radio" name="checkit" value="c"><br>
</form>
涓嬮潰鏄痭ame鍊間笉鍚岀殑涓€涓緥瀛愶紝灝變笉鑳藉疄鐜板閫変竴鐨勬晥鏋滀簡<br>
<form name="form1">
a:<input type="radio" name="checkit1" value="a" checked><br>
b:<input type="radio" name="checkit2" value="b"><br>
c:<input type="radio" name="checkit3" value="c"><br>
</form>

8錛宼ype=image
姣旇緝鍙︾被鐨勪竴涓紝鑷繁鐪嬬湅鏁堟灉鍚э紝鍙互浣滀負鎻愪氦寮忓浘鐗?/p>

<form name="form1" action="xxx.asp">
your Imgsubmit:
<input type="image" src="../blog/images/face4.gif">
</form>

9錛宼ype=submit and type=reset
鍒嗗埆鏄?#8220;鎻愪氦”鍜?#8220;閲嶇疆”涓ゆ寜閽?
submit涓昏鍔熻兘鏄皢Form涓墍鏈夊唴瀹硅繘琛屾彁浜ction欏靛鐞嗭紝reset鍒欒搗涓揩閫熸竻絀烘墍鏈夊～鍐欏唴瀹圭殑鍔熻兘銆?/p>

<form name="form1" action="xxx.asp">
<input type="text" name="yourname">
<input type="submit" value="鎻愪氦">
<input type="reset" value="閲嶇疆">
</form>

JavaBird 2011-12-22 14:25 鍙戣〃璇勮