±íµ¥
Ò» ¸ö HTML ±í µ¥ ÊÇ ÎÄ µµ ÖÐ °ü º¬ ±ê ×¼ ÄÚ ÈÝ, ±ê ×¢ ºÍ ½Ð ×ö ¿Ø¼þ
µÄ ÌØ Êâ Ôª ËØ µÄ ²¿ ·Ö. ¿Ø ¼þ Ïì Ó¦ ²¢ ½Ó ÊÜ Óà »§ Êä Èë. Óà »§ ͨ ³£
ͨ ¹ý Êä Èë ÎÄ ×Ö, Ñ¡ Ôñ ²Ë µ¥ Ìõ Ä¿ µÈ À´ "Íê ³É" ±í µ¥, È» ºó Ìá ½» ±í
µ¥ ÒÔ ¹© ´¦ Àí. Ìá ½» µÄ ±í µ¥ ¿É ÒÔ Í¨ ¹ý µç ×Ó ÓÊ ¼þ ·¢ ËÍ ¸ø ±ð ÈË Ò²
¿É ÒÔ ·¢ ËÍ ¸ø ³Ì ʽ À´ ´¦ Àí.
¿Ø ¼þ ¿É ÒÔ ÊÇ ¸´ Ñ¡ ¿ò, µ¥ Ñ¡ ¿ò, ±ê Ç©, ²Ë µ¥ µÈ. ÿ ¸ö ¿Ø ¼þ ¿É ÒÔ
·Ö Åä Ò» ¸ö Ãû ³Æ. µ± ±í µ¥ ±» Ìá ½» ʱ, Ò» Щ ¿Ø ¼þ (È¡¾öÓÚËüÃǵÄ״̬)
µÄ Ãû ³Æ ºÍ µ± Ç° Öµ Ëæ ±í µ¥ Ò» Æð ·¢ ËÍ. Ìá ½» µÄ Öµ µÄ ×Ô È» Êô ÐÔ È¡
¾ö ÓÚ ¿Ø ¼þ (Àý Èç: ÎÄ ±¾ ¿ò µÄ Öµ ÊÇ Êä Èë µÄ ÎÄ ±¾).
×¢ Òâ: Õâ ·Ý Ëµ Ã÷ Êé ÔÚ ±íµ¥ÏÔʾÎÊÌâ
ÖÐ °ü º¬ ÁË ¸ü ¶à µÄ ¹Ø ÓÚ ±í µ¥ µÄ ϸ ½Ú ЊϢ. ¹Ø ÓÚ ¶Ô ±í ¸ñ ÄÚ ÈÝ ±à
Âë µÄ ÐŠϢ ÒÑ ¾ ´ò Ëã ¼Ó ÔÚ Õâ ·Ý ²Ý °¸ ÒÔ ºó µÄ °æ ±¾ ÖÐ.
FORM ÔªËØ
<!ELEMENT FORM - - %block -(FORM)>
<!ATTLIST FORM
%attrs; -- %coreattrs, %i18n, %events --
action %URL #REQUIRED -- server-side form handler --
method (GET|POST) GET -- HTTP method used to submit the form --
enctype %ContentType; "application/x-www-form-urlencoded"
onsubmit %Script #IMPLIED -- the form was submitted --
onreset %Script #IMPLIED -- the form was reset --
target CDATA #IMPLIED -- where to render result --
accept-charset CDATA #IMPLIED -- list of supported charsets --
>
¿ª ʼ ±ê ¼Ç: Ðè Òª , ½á Êø ±ê ¼Ç: Ðè Òª
ÌØ ÐÔ ¶¨ Òå
action = url
Õâ ¸ö ÌØ ÐÔ Ö¸ ¶¨ Ò» À´ ´¦ Àí Ìá ½» ±í µ¥ µÄ ¸ñ ʽ. Ëü ¿É ÒÔ ÊÇ Ò» ¸ö HTTP
URL (Ìá ½» ¸ø ³Ì ʽ) »ò Ò» ¸ö µç×ÓÓʼþ(MAILTO)
URL (ÓÊ µÝ Õâ ¸ö ±í µ¥).
method = get|post
Õâ ¸ö ÌØ ÐÔ Ö¸ Ã÷ ÄÄ ÖÖ HTTP ·½ ·¨ ½« ±» Óà À´ Ìá ½» Ãû ³Æ/ Öµ ¶Ô ¸ø ±í
µ¥ ´¦ Àí Õß. ¿É ÄÜ µÄ Öµ Ϊ:
post: ʹ Óà HTTP POST ·½ ·¨. POST ·½ ·¨ ÔÚ ±í µ¥ µÄ Ö÷ ¸É °ü º¬
Ãû³Æ/Öµ ¶Ô ²¢ ÇÒ ÎÞ Ðè °ü º¬ ÓÚ action
ÌØ ÐÔ µÄ URL ÖÐ.
get: ²» ÔÞ ³É. ʹ Óà HTTP GET ·½ ·¨. GET ·½ ·¨ °Ñ Ãû³Æ/Öµ
¶Ô ¼Ó ÔÚ action µÄ URL ºó
Ãæ ²¢ ÇÒ °Ñ РµÄ URL ËÍ ÖÁ ·þ Îñ Æ÷. Õâ ÊÇ Íù Ç° ¼æ ÈÝ µÄ ȱ Ê¡ Öµ. Õâ
¸ö Öµ ÓÉ ÓÚ ¹ú ¼Ê »¯ µÄ Ô Òò ²» ÔÞ ³É.
enctype = cdata
Õâ ¸ö ÌØ ÐÔ Ö¸ Ã÷ Óà À´ °Ñ ±í µ¥ Ìá ½» ¸ø ·þ Îñ Æ÷ ʱ (µ± method
Öµ Ϊ "post") µÄ »¥ Áª Íø ý Ìå ÐΠʽ (Internet Media Type, ²Î ¼û [MIMETYPES] ).
Õâ ¸ö ÌØ ÐÔ µÄ ȱ Ê¡ Öµ ÊÇ "application/x-www-form-urlencoded". Öµ "multipart/form-data"
Ó¦ µ± ±» Óà ÓÚ ·µ »Ø µÄ ÎÄ µµ ÖÐ °ü º¬ Ìá ½» ÎÄ ¼þ ʱ.
accept-charset = cdata
Õâ ¸ö ÌØ ¶¨ Ö¸ ¶¨ ÁË Ò» ¸ö ¿É ÒÔ ±» ·þ Îñ Æ÷ ´¦ Àí Õâ ¸ö ±í µ¥ µÄ Êä Èë
Êý ¾Ý ʱ ½Ó ÊÜ µÄ ×Ö·û±àÂë ÁÐ
±í. Õâ ¸ö Öµ ÊÇ ÔÚ [RFC2045]
ÖÐ µÄ ¶¨ Òå µÄ Óà ¿Õ ¸ñ ºÍ/»ò ¶º ºÅ ·Ö ÁÐ µÄ "character" ÁÐ ±í. ·þ Îñ Æ÷
±Ø Ðë °Ñ Õâ ¸ö ÁÐ ±í ½â ÊÍ Îª ¶À Õ¼ ÁÐ ±í, ¾Í ÊÇ Ëµ ·þ Îñ Æ÷ ±Ø ÄÜ ¹» ½Ó
ÊÜ Ã¿ ¸ö Ìõ Ä¿ ÊÕ µ½ ʱ µÄ µ¥ ¶À ×Ö ·û ±à Âë.
Õâ ¸ö ÌØ ÐÔ µÄ ȱ Ê¡ Öµ ÊÇ ±£ Áô ×Ö ´® "UNKNOWN". Óà »§ ´ú Àí Æ÷ ¿É
ÒÔ °Ñ ´Ë Öµ ½â Òë ×÷ °ü º¬ ÔÚ FORM
Ôª ËØ ÖÐ µÄ Óà ÓÚ ´« ËÍ ÎÄ µµ µÄ ±à Âë ·½ ʽ.
accept = cdata
Õâ ¸ö ÌØ ÐÔ Ö¸ Ã÷ ÁË Ò» ¸ö ·þ Îñ Æ÷ ´¦ Àí ÄÜ ¹» Õý È· ´¦ Àí Õâ ¸ö ±í µ¥
µÄ Óà ¶º ºÅ ·Ö ÁÐ µÄ MIME ¸ñ ʽ ÁÐ ±í. µ± Ìá ʾ Óà »§ Ñ¡ Ôñ Ò» ¸ö ÎÄ ¼þ
·¢ ËÍ µ½ ·þ Îñ Æ÷ ʱ (ͨ ¹ý INPUT
Ôª ËØ µÄ type ="file"), Óà »§
´ú Àí Æ÷ ¿É ÒÔ Ê¹ Óà Õâ ЊϢ À´ ¹ý ÂË µô ²» Ò» Ö µÄ ÎÄ ¼þ.
ÔÚ Ëü ´¦ ¶¨ Òå µÄ ÌØ ÐÔ
id , class
(¹ã·ºµÄÎĵµ±êʶ·û )
lang (ÓïÑÔÐÅÏ¢ ),
dir (ÎÄ×Ö·½Ïò )
style (ÄÚ²ã·ç¸ñÖ»ÐíÐÅÏ¢ )
title (ÔªËرêÌâ )
target (Ä¿±ê¿ò¼ÜÐÅÏ¢ )
onsubmit , onreset ,
(ÄÚ²¿Ê¼þ )
onclick , ondblclick ,
onmousedown , onmouseup ,
onmouseover , onmousemove ,
onmouseout , onkeypress ,
onkeydown , onkeyup
(ÄÚ²¿Ê¼þ )
FORM Ôª ËØ ×÷ Ϊ ¿Ø ¼þ µÄ ÈÝ
Æ÷. Ëü Ö¸ ¶¨ ÁË:
±í µ¥ µÄ ½ç Ãæ (ͨ ¹ý Ôª ËØ ÄÚ ÈÝ ¸ø ³ö).
½« Óà À´ ´¦ Àí Íê ³É ºÍ Ìá ½» ±í µ¥ µÄ ³Ì ʽ (action
ÌØ ÐÔ). Ϊ ÁË Ê¹ Óà Ëü ÃÇ ÊÕ µ½ µÄ ³Ì ʽ ±Ø Ðë ÄÜ ¹» ÆÊ Îö Ãû³Æ/Öµ ¶Ô.
Óà »§ Êý ¾Ý ͨ ¹ý ÄÄ ÖÖ ·½ ʽ ËÍ µ½ ·þ Îñ Æ÷ (method
ÌØ ÐÔ).
Ϊ ÁË ´¦ Àí Õâ ¸ö ±í µ¥ ×Ö ·û ±à Âë ·½ ʽ ±Ø Ðë ÄÜ ¹» ±» ·þ Îñ Æ÷ ½Ó ÊÜ
(accept-charset ÌØ
ÐÔ). Óà »§ ´ú Àí Æ÷ ¿É ÒÔ ½¨ Òé Óà »§ µÄ accept-charset
ÌØ ÐÔ Öµ ºÍ/»ò ÓÐ ·À Ö¹ Óà »§ Êä Èë ²» ÈÏ Ê¶ µÄ ×Ö ·û µÄ ÄÜ Á¦.
Ò» ¸ö ±í µ¥ ¿É ÒÔ °ü º¬ ÎÄ ×Ö ºÍ ±ê ×¢ (¶Î Âä, ÁÐ ±í µÈ µÈ) ¾Í Ïó ÁРʾ
ÓÚ Ï µÄ ¿Ø ¼þ ÄÇ Ñù.
ÔÚ FORM Ôª ËØ ÖÐ ÈÎ ºÎ ÌØ
ÐÔ µÄ name ÌØ ÐÔ ÓРЧ ·¶ Χ ÊÇ FORM
Ôª ËØ.
Ï Ãæ µÄ Àý ³Ì Ö¸ ¶¨ ÁË Ìá ½» µÄ ±í µ¥ ½« ±» "adduser"
³Ì ʽ ´¦ Àí. Õâ ¸ö ±í µ¥ ½« ͨ ¹ý HTTP POST ·½ ·¨ ·¢ ËÍ µ½ ³Ì ʽ.
<FORM action="http://somesite.com/prog/adduser" method="post">
...form contents...
</FORM>
Ï Ãæ µÄ Àý ³Ì Õ¹ ʾ ÁË Èç ºÎ °Ñ Ò» ¸ö Ìá ½» ±í µ¥ ·¢ ËÍ µ½ Ò» ¸ö µç ×Ó
ÓÊ ¼þ µØ Ö·.
<FORM action="mailto:Kligor.T@gee.whiz.com" method="post">
...form contents...
</FORM>
¿Ø¼þ
Ï Ãæ µÄ ¿Ø ¼þ Ôª ËØ Í¨ ³£ ³ö ÏÖ ÓÚ Ò» ¸ö FORM
Ôª ËØ Éù Ã÷ ÖÐ. È» ¶ø, Õâ Щ Ôª ËØ µ± Óà À´ ½¨ Á¢ Óà »§ ½Ó ¿Ú ʱ Ò² ¿É
ÒÔ ³ö ÏÖ ÔÚ FORM Ôª ËØ Éù Ã÷
Íâ. Õâ ½« ÔÚ Ëµ Ã÷ Êé ÖÐ ÉÔ ºó ÌÖ ÂÛ, ÔÚ ÄÚ²¿Ê¼þ
ÕÂ ½Ú ÖÐ.
¿Ø¼þ±êÇ©
ij Щ ±í µ¥ ¿Ø ¼þ ×Ô ¶¯ Áª ϵ ±ê Ç© (ͨ ¹ý INPUT
ºÍ BUTTON ½¨ Á¢ µÄ °´ Å¥)
È» ¶ø ´ó ¶à Êý ²» Õâ Ñù (ͨ ¹ý INPUT
ºÍ TEXTAREA µÄ ÎÄ ±¾ Óò,
ͨ ¹ý INPUT ½¨ Á¢ µÄ ¸´ Ñ¡
¿ò ºÍ µ¥ Ñ¡ ¿ò ºÍ Óà SELECT
½¨ Á¢ µÄ Ôª ËØ).
¶Ô ÓÚ ÄÇ Ð© º¬ ÓÐ °µ ʽ ±ê Ç© µÄ ¿Ø ¼þ, Óà »§ ´ú Àí Æ÷ Ó¦ µ± °Ñ value
ÌØ ÐÔ Öµ ×÷ Ϊ ±ê Ç© ×Ö ´®.
¶Ô ÓÚ ÄÇ Ð© û ÓÐ °µ ʽ ±ê Ç© µÄ ¿Ø ¼þ, ×÷ Õß ±Ø Ðë ÔÚ ¿Ø ¼þ Ôª ËØ ¶¨
Òå µÄ Ç° »ò ºó Ìá ¹© ±ê Ç©. ¾Ù Àý ˵ Ã÷ Èç ÏÂ.
INPUT ÔªËØ
<!ENTITY % InputType
"(TEXT | PASSWORD | CHECKBOX |
RADIO | SUBMIT | RESET |
FILE | HIDDEN | IMAGE | BUTTON)"
>
<!-- HSPACE and VSPACE missing due to lack of widespread support -->
<!ELEMENT INPUT - O EMPTY>
<!ATTLIST INPUT
%attrs; -- %coreattrs, %i18n, %events --
type %InputType TEXT -- what kind of widget is needed --
name CDATA #IMPLIED -- required for all but submit & reset --
value CDATA #IMPLIED -- required for radio and checkboxes --
checked (checked) #IMPLIED -- for radio buttons and check boxes --
disabled (disabled) #IMPLIED -- control is unavailable in this context --
readonly (readonly) #IMPLIED -- for text and passwd --
size CDATA #IMPLIED -- specific to each type of field --
maxlength NUMBER #IMPLIED -- max chars for text fields --
src %URL #IMPLIED -- for fields with images --
alt CDATA #IMPLIED -- description for text only browsers --
usemap %URL #IMPLIED -- use client-side image map --
align %IAlign #IMPLIED -- vertical or horizontal alignment --
tabindex NUMBER #IMPLIED -- position in tabbing order --
onfocus %Script #IMPLIED -- the element got the focus --
onblur %Script #IMPLIED -- the element lost the focus --
onselect %Script #IMPLIED -- some text was selected --
onchange %Script #IMPLIED -- the element value was changed --
accept CDATA #IMPLIED -- list of MIME types for file upload --
>
¿ª ʼ ±ê Ç©: Ðè Òª , ½á Êø ±ê Ç©: ½û Ö¹
ÌØ ÐÔ ¶¨ Òå
type = text|password|checkbox|radio|submit|reset|file|hidden|image|button
Õâ ¸ö ÌØ ÐÔ Ö¸ ¶¨ ÁË Òª ½¨ Á¢ µÄ Êä Èë ¿Ø ¼þ. ÎÒ ÃÇ ÔÚ ºó Ãæ ÌÖ ÂÛ ÊäÈë¿Ø¼þ¸ñʽ
. Õâ ¸ö ÌØ ÐÔ µÄ ȱ Ê¡ Öµ ÊÇ "text".
name = cdata
Õâ ¸ö ÌØ ÐÔ Îª ¿Ø ¼þ Ìá ¹© Ò» ¸ö Ãû ³Æ. Õâ ¸ö Ãû ³Æ ½« Óë ¿Ø ¼þ µÄ µ± Ç°
Öµ ³É ¶Ô Èç ¹û Ôª ËØ Öµ Óë ±í µ¥ Ò» ͬ Ìá ½» µÄ »°.
value = cdata
Õâ ¸ö ÌØ ÐÔ Ö¸ ¶¨ ÁË ¿Ø ¼þ µÄ ³õ ʼ Öµ. Ëü ÊÇ ¿É Ñ¡ µÄ ³ý ·Ç ¿Ø ¼þ ÐΠʽ
ÊÇ "radio" (Òë Õß:¼´ µ¥ Ñ¡ ¿ò).
size = cdata
Õâ ¸ö ÌØ ÐÔ ¸æ Ëß Óà »§ ´ú Àí Æ÷ ¿Ø ¼þ µÄ ³õ ʼ ¿í ¶È. Õâ ¸ö ¿í ¶È Óà Ïñ
ËØ ¸ø ³ö, ³ý ·Ç "text" ºÍ "password" ¿Ø ¼þ ¸ñ ʽ ÊÇ (Õû Êý µÄ) ×Ö ·û Êý
Ä¿.
maxlength = integer
µ± ¿Ø ¼þ ¸ñ ʽ Ϊ "text" »ò "password" ʱ, Õâ ¸ö ÌØ ÐÔ Ö¸ ¶¨ µÄ ¿É ÒÔ Êä
Èë µÄ ×Ö ·û µÄ ×î ´ó Á¿. Õâ ¸ö Êý Öµ ¿É ÒÔ ³¬ ¹ý Ö¸ ¶¨ µÄ size ,
Õâ ¸ö Çé ¿ö Ï Óà »§ ´ú Àí Æ÷ ¾Í µ± Ìá ¹© Ò» ¸ö ¹ö ¶¯ ½á ¹¹. Õâ ¸ö ÌØ ÐÔ
µÄ ȱ Ê¡ Öµ ÊÇ ¶Ô Êý Á¿ û ÓÐ ÏÞ ÖÆ µÄ.
checked
µ± ¿Ø ¼þ ¸ñ ʽ Ϊ "radio" (µ¥ Ñ¡ ¿ò) ʱ, Õâ ¸ö ²¼ ¶û Öµ Ö¸ ¶¨ ÁË µ¥ Ñ¡
¿ò ±» Ñ¡ ÖÐ. Õâ ¸ö ÌØ ÐÔ ±Ø Ðë ±» Æä Ëü µÄ ¿Ø ¼þ ¸ñ ʽ ºö ÂÔ.
src = url
µ± ¿Ø ¼þ ¸ñ ʽ Ϊ "image" ʱ, Õâ ¸ö ÌØ ÐÔ Ö¸ ¶¨ µÄ Óà À´ ×° ÊΠͼ °¸ ʽ
Ìá ½» °´ Å¥ µÄ ͼ °¸ λ ÖÃ.
ÔÚ Ëü ´¦ ¶¨ Òå µÄ ÌØ ÐÔ
id , class
(¹ã·ºµÄÎĵµ±êʶ·û )
lang (ÓïÑÔÐÅÏ¢ ),
dir (ÎÄ×Ö·½Ïò )
title (ÔªËرêÌâ )
style (ÄÚ²ã·ç¸ñÖ»ÐíÐÅÏ¢ )
alt (ÂÖÌæÎÄ×Ö )
align (¶ÔÆ뷽ʽ )
accept (·þÎñÆ÷µÄºÏ·¨µÄ
MIME ¸ñʽ )
readonly (Ö»¶ÁÊäÈë¿Ø¼þ )
disabled (¿Ø¼þ½ûÖ¹ÊäÈë )
tabindex (ÖƱí¼üµ¼º½ )
usemap (¿Í»§¶ËͼÏñÓ³Ïñ )
onfocus , onblur ,
onselect , onchange
(ÄÚ²¿Ê¼þ )
onclick , ondblclick ,
onmousedown , onmouseup ,
onmouseover , onmousemove ,
onmouseout , onkeypress ,
onkeydown , onkeyup
(ÄÚ²¿Ê¼þ )
ͨ ¹ý INPUT Ôª ËØ ¶¨ Òå µÄ
¿Ø ¼þ µÄ ×Ô È» Êô ÐÔ È¡ ¾ö ÓÚ type
ÌØ ÐÔ µÄ Öµ.
ÊäÈë¸ñʽ
INPUT Ôª ËØ µÄ type
ÌØ ÐÔ ¶¨ Òå ÁË ÄÄ ÖÖ ¿Ø ¼þ ½« ±» ½¨ Á¢.
text
Õâ ¸ö ¸ñ ʽ ½¨ Á¢ Ò» ¸ö µ¥ ÐÐ ÎÄ ±¾ ¿ò. Õâ ¸ö ͨ ¹ý ÎÄ ±¾ ¿ò ¿ò Ìá ½» µÄ
Öµ ÊÇ Êä Èë µÄ ÎÄ ×Ö.
password
Èç ͬ "text", µ« Õâ ¸ö ¿Ø ¼þ µÄ Êä Èë ÎÄ ×Ö Í¨ À´ Ò» ÖÖ Òþ ²Ø ×Ö ·û µÄ
·½ ʽ À´ äÖ È¾ (Èç Ò» ϵ ÁÐ ÐÇ ºÅ). Õâ ¸ö ¿Ø ¼þ Óà ÓÚ ´ó С д Ïà ¹Ø µÄ
Èç ÃÜ Âë µÄ Êä Èë. Õâ ¸ö ͨ ¹ý ÃÜ Âë ¿Ø ¼þ Ìá ½» µÄ Öµ ÊÇ Êä Èë µÄ ÎÄ ×Ö
(²¢ ·Ç äÖ È¾ µÄ ¶« Î÷).
checkbox
Ò» ¸ö ¸´ Ñ¡ ¿ò ÓÐ Ò» ¸ö ´ò¿ª/¹Ø±Õ ¿ª ¹Ø. µ± ¿ª ¹Ø ´ò ¿ª ʱ, ¸´ Ñ¡ ¿ò µÄ
Öµ ÊÇ "active". µ± ¿ª ¹Ø ¹Ø ±Õ ʱ, Õâ ¸ö Öµ ÊÇ Ôò û ÓÐ ¼¤ »î. ¸´ Ñ¡ ¿ò
µÄ Öµ Ö» ÓÐ ÔÚ ¸´ Ñ¡ ¿ò ±» Ñ¡ ÖРʱ Ìá ½».
Êý ¸ö ÔÚ Í¬ Ò» ¸ö ±í µ¥ ÖÐ µÄ ¸´ Ñ¡ ¿ò ¿É ÒÔ Ê¹ Óà ͬ Ò» ¸ö Ãû ³Æ. ÔÚ
Ìá ½» ʱ, ÿ Ò» ¸ö "´ò ¿ª" µÄ ¾ß ÓÐ Ïà ͬ Ãû ³Æ µÄ ¸´ Ñ¡ ¿ò ʹ Óà Ïà ͬ
µÄ Ãû ³Æ ×é ¼þ Ìá ½» Ò» ¸ö Ãû³Æ/Öµ ¶Ô. Õâ ÔÊ Ðí Óà »§ ´ú Àí Æ÷ ¶Ô ¸ø ¶¨
µÄ Êô ÐÔ Ñ¡ Ôñ ³¬ ¹ý Ò» ¸ö µÄ Öµ.
radio
Ò» ¸ö µ¥ Ñ¡ ¿ò ÊÇ Ò» ¸ö ´ò¿ª/¹Ø±Õ ¿ª ¹Ø. µ± Õâ ¸ö ¿ª ¹Ø ´ò ¿ª ʱ, Õâ ¸ö
µ¥ Ñ¡ ¿ò µÄ Öµ ÊÇ "active". µ± ¿ª ¹Ø ¹Ø ±Õ ʱ, Õâ ¸ö Öµ Ôò û ÓÐ ¼¤ ¼â.
µ¥ Ñ¡ ¿ò µÄ Öµ Ö» ÓÐ ÔÚ ¿ª ¹Ø ´ò ¿ª ʱ Ìá ½».
Êý ¸ö ÔÚ Í¬ Ò» ¸ö ±í µ¥ µÄ µ¥ Ñ¡ ¿ò ¿É ÒÔ ÓÐ Ò» ¸ö Ãû ³Æ. È» ¶ø, Ëü
Щ °´ Å¥ ÖÐ ÔÚ Í¬ Ò» ¸ö ʱ ¿Ì Ö» ÓÐ Ò» ¸ö ¿É ÒÔ ±» "´ò ¿ª". ÔÚ Ä³ ¸ö Éè
¶¨ Ϊ "´ò ¿ª" µÄ ʱ ºò, Ëù ÓÐ Ïà ¹Ø µÄ °´ Å¥ ¶¼ ÊÇ "¹Ø ±Õ". Òò ´Ë, ¶Ô ÓÚ
Ïà ¹Ø µ¥ Ñ¡ °´ Å¥, Ö» ÓÐ Ò» ¸ö Ãû³Æ/Öµ ¶Ô ±» Ìá ½».
submit
½¨ Á¢ Ò» ¸ö Ìá ½» °´ Å¥. µ± Õâ ¸ö °´ Å¥ ±» Óà »§ ¼¤ »î ʱ, ±í µ¥ ±» Ìá
½» µ½ ÔÚ È« ¾Ö FORM Ôª ËØ µÄ
action Ö¸ ¶¨ µÄ λ ÖÃ.
Ò» ¸ö ±í µ¥ ¿É ÒÔ °ü º¬ Ò» ¸ö ÒÔ ÉÏ µÄ Ìá ½» °´ Å¥. Ö» ÓÐ Ò» ¸ö ¼¤ »î
µÄ Ãû³Æ/Öµ ¶Ô Óë ±í µ¥ Ò» Æð ±» Ìá ½».
image
½¨ Á¢ Ò» ¸ö ͼ Ïñ »¯ µÄ submit °´ Å¥. src
ÌØ ÐÔ µÄ Öµ Ö¸ ¶¨ ÁË ½« ÐÞ ÊÎ °´ Å¥ µÄ ͼ Ïñ µÄ URL. ij Щ Óà »§ ¿É ÄÜ
ÎÞ ·¨ ¿´ µ½ Õâ Щ ͼ Ïñ. ÎÒ ÃÇ Ç¿ ÁÒ ½¨ Òé ͨ ¹ý Ìá ¹© alt
ÌØ ÐÔ Öµ À´ Ìá ¹© Ò» ¸ö ͼ Ïñ µÄ ÂÖ Ìæ ÎÄ ×Ö.
µ± Ò» ¸ö ¶¨ λ ×° Öà ÔÚ Í¼ Ïñ ÉÏ µ¥ »÷ µÄ ʱ ºò, ±í µ¥ ±» Ìá ½» ²¢ ÇÒ
λ Öà ±» ´« ËÍ µ½ ·þ Îñ Æ÷. x Öµ ÊÇ ´Ó ͼ Ïñ µÄ ×ó Ãæ ¿ª ʼ µÄ ÒÔ Ïñ ËØ
Ϊ µ¥ λ µÄ ³ß ´ç, ¶ø y Öµ ÊÇ ´Ó ͼ Ïñ µÄ ¶¥ ¶Ë ¿ª ʼ µÄ ÒÔ Ïñ ËØ Îª µ¥
λ µÄ ³ß ´ç. Õâ Ìá ½» µÄ Êý Öµ °ü º¬ name .x=x-value ºÍ name .y=y-value
ʱ, Õâ Àï µÄ "name" ÊÇ name ÌØ ÐÔ Öµ, ¶ø x-value
ºÍ y-value ÊÇ x ºÍ y ×ø ±ê ¸÷ ×Ô µÄ Öµ.
Èç ¹û ·þ Îñ Æ÷ ¸ù ¾Ý µ¥ »÷ µÄ λ Öà ²É Óà ²» ͬ µÄ ¶Ô ´ý, ʹ Óà ·Ç ͼ
°¸ »¯ ä¯ ÀÀ Æ÷ µÄ Óà »§ ½« ʧ È¥ ÓÅ ÊÆ. ÓÉ ÓÚ Õâ ¸ö Ô Òò, ½¨ Òé Äã ¿¼
ÂÇ ÂÖ Ìæ ; ¾¶:
ʹ Óà ¶à ¸ö Ìá ½» °´ Å¥ (ÿ ¸ö ¶¼ ÓÐ Æä ×Ô Éí µÄ Í¼ Ïñ) À´ ´ú Ìæ Ò» ¸ö
¼ò µ¥ µÄ ͼ °¸ Ìá ½» °´ Å¥. Äã ¿É ÒÔ Ê¹ Óà ·ç ¸ñ Ò³ À´ ¿Ø ÖÆ Õâ Щ °´ Å¥
µÄ λ ÖÃ.
Óë ½Å ±¾ ¹² ͬ ʹ Óà һ ¸ö ¿Í»§¶ËͼÏñÓ³Ïñ .
µ± "type =image"
ʱ Ò» ¸ö ¿É ÄÜ µÄ ¹¦ ÄÜ À© Õ¹ ½« °Ñ usemap
ÌØ ÐÔ ¼Ó µ½ INPUT ÓÃ ×÷ ¿Í
»§ ¶Ë ͼ Ïñ Ó³ Ïñ . ¶Ô Ó¦ ÓÚ µ¥ »÷ λ Öà µÄ AREA
Ôª ËØ ½« ÓÐ Öú ÓÚ °Ñ Öµ ´« µ½ ·þ Îñ Æ÷. Ϊ ÁË ±Ü Ãâ Ðë Òª ÐÞ ¸Ä ·þ Îñ Æ÷
½Å ±¾ µÄ ±Ø Òª, Ëü ¿É ±» ÊÊ µ± µØ À© Õ¹ AREA
À´ Ìá ¹© x ºÍ y Öµ À´ Óë INPUT
Ôª ËØ Í¬ ʱ ʹ ÓÃ.
reset
½¨ Á¢ Ò» ¸ö ¸´ λ °´ Å¥ (ÎÒ ¾ ³£ Óà "ÖØ Ìî" À´ ±ê ʶ Õâ ¸ö °´ Å¥). µ±
Õâ ¸ö °´ Ť ±» Óà »§ ¼¤ »î ʱ, ±í µ¥ ÖÐ µÄ Ëù ÓÐ ¿Ø ¼þ ±» ÖØ Éè Ϊ ͨ ¹ý
Ëü ÃÇ µÄ value Ö¸ ¶¨ µÄ ³õ ʼ Öµ. ¸´ λ °´ Å¥ µÄ Ãû³Æ/Öµ ²» Óë
±í µ¥ Ò» Æð Ìá ½».
button
½¨ Á¢ µÄ °´ Å¥ û ÓРȱ Ê¡ ÐРΪ. °´ Ť ÐРΪ ͨ ¹ý Áª ϵ ¿Í »§ ¶Ë °´ Å¥
Ê ¼þ À´ ¶¨ Òå (Èç µ¥ »÷ °´ Å¥). value ÌØ ÐÔ µÄ Öµ ±» Óà ×÷ °´
Å¥ µÄ ±ê Ç©.
Àý Èç, Ï ÁÐ µÄ Éù Ã÷ µ± °´ Å¥ ±» ¼¤ »î ʱ Òý Æð ±»
½Ð ×ö µÄ
verify µÄ º¯ Êý ±» Ö´ ÐÐ. Õâ ¸ö ½Å ±¾ ÊÇ
SCRIPT
Ôª ËØ ¶¨ Òå µÄ.
<INPUT type="button" value="Click Me" onclick="verify()">
Çë ²Î ¼û ÄÚ²¿Ê¼þ Õ ½Ú »ñ µÃ ¸ü ¶à µÄ
¹ØÓÚ ½Å ±¾ ºÍ Ê ¼þ µÄ ЊϢ.
hidden
½¨ Á¢ Ò» ¸ö ²» ±» Óà »§ ´ú Àí Æ÷ äÖ È¾ µÄ Ôª ËØ. È» ¶ø, Ôª ËØ µÄ Ãû ³Æ
ºÍ Öµ »¹ ÊÇ Óë ±í µ¥ Ò» Æð Ìá ½».
Õâ ¸ö ¿Ø ¼þ ¸ñ ʽ ͨ ³£ ±» Óà À´ ±£ ´æ ¿Í»§¶Ë/·þÎñÆ÷ Ö® ¼ä µÄ ¿É ÄÜ
±» HTTP ¶ª ʧ µÄ ½» »» ЊϢ.
INPUT ¿Ø ¼þ µÄ hidden
¸ñ ʽ ÓÐ Æä ×Ô Éí µÄ Óë ±í µ¥ Ò» Æð ´« ËÍ µÄ Öµ. ¹² ͬ °ü º¬ ÓÚ ÖÐ µÄ Ò²
²» ±» äÖ È¾ Òò Ϊ ·ç ¸ñ ЊϢ µÄ Ô Òò. Ï ÁÐ µÄ ¿Ø ¼þ, µ± È» ²» ±» ÓÃ
»§ ´ú Àí Æ÷ äÖ È¾, ½« Óë ±í µ¥ Ò» Æð Ìá ½» Ëü ÃÇ µÄ Öµ.
<INPUT type="password" style="display:none"
name="invisible-password"
value="mypassword">
file
ÏÔ ²» Óà »§ Ò» ¸ö ÎÄ ¼þ Ãû ³Æ. µ± Õâ ¸ö ±í µ¥ ±» ¼¤ »î ʱ, ÎÄ ¼þ ¿Ø ¼þ
Èç ͬ Æä Ëü Óà »§ Êä Èë Ò» °ã ±» Ìá ½» µ½ ·þ Îñ Æ÷.
Óà »§ ´ú Àí Æ÷ ¾Í µ± °Ñ Õâ Щ ÎÄ ¼þ ѹ Ëõ ·â ×° Ϊ Ò» ¸ö MIME multipart
ÎÄ µµ (²Î ¼û [RFC2045] ).
Õâ ¸ö ½á ¹¹ °Ñ ÿ ¸ö ÎÄ ¼þ ÒÔ Ò» ÖÖ MIME multipart µÄ ¸ñ ʽ ѹ Ëõ ·â ×°
°Ñ Õû Ìå ´« ËÍ ¸ø HTTP. ÿ ¸ö Ö÷ ¸É ²¿ ·Ö ¿É ÒÔ ±» ±ê Ç© Ϊ Ò» ¸ö Áª ϵ
ÓÚ "Content-Type" µÄ ¸ñ ʽ, °ü À¨ Èç ¹û Ðè Òª Ò» ¸ö "charset" ²Î Êý À´
Ö¸ ¶¨ ×Ö ·û ±à Âë.
Ï Ãæ µÄ Àý ³Ì HTML Ƭ ¶Ï ¶¨ Òå ÁË Ò» ¸ö ¼ò µ¥ ±í
µ¥ ÔÊ Ðí Óà »§ Êä Èë Ãû,ÐÕ, µç ×Ó ÓÊ ¼þ µØ ÆðÂë, ÒÔ ¼° ÐÔ ±ð. µ± Ìá ½»
°´ Å¥ ±» ¼¤ »î ʱ, Õâ ¸ö ±í µ¥ ±» ËÍ µ½ ÒÔ
action
Ö¸ ¶¨ µÄ ³Ì ʽ..
<FORM action="http://somesite.com/prog/adduser" method="post">
<P>
First name: <INPUT type="text" name="firstname"><BR>
Last name: <INPUT type="text" name="lastname"><BR>
email: <INPUT type="text" name="email"><BR>
<INPUT type="radio" name="sex" value="Male"> Male<BR>
<INPUT type="radio" name="sex" value="Female"> Female<BR>
<INPUT type="submit" value="Send"> <INPUT type="reset">
</FORM>
Õâ ¸ö ±í µ¥ »á ±» Èç Ï äÖ È¾:
ÔÚ
LABEL
Ôª ËØ µÄ ²¿ ·Ö, ÎÒ ÃÇ ¾ö ¶¨ ±ê ×¢ ±ê Ç© Ϊ "First name".
Ï Ãæ µÄ ÁÐ ³Ì Õ¹ ʾ ÁË Ò» ¸ö Óà »§ Ö¸ ¶¨ ÎÄ ¼þ µÄ
ÄÚ ÈÝ Èç ºÎ Óë ±í µ¥ Ò» Æð ±» Ìá ½». Õâ ¸ö Àý ³Ì »ù ÓÚ
[RFC1867]
µÄ Àý ³Ì.
ÔÚ ´Ë Àý ÖÐ, Óà »§ ±» Ìá ʾ Êä Èë ½« ÓÚ ±í µ¥ Ò» Æð Ìá ½» µÄ Ò» ¸ö ÎÄ
¼þ ºÍ Ò» ´® ÎÄ ¼þ Ãû ÁÐ ±í. ͨ ¹ý Ö¸ ¶¨ enctype
Öµ Ϊ "multipart/form-data", ÿ ¸ö ÎÄ ¼þ µÄ ÄÚ ÈÝ ¾ù ÔÚ ´æ ·Å ÓÚ Ò» ¸ö
multipart ÎÄ µµ µÄ µ¥ ¶À µÄ ²¿ ·Ö ÖÐ.
<FORM action="http://server.dom/cgi/handle"
enctype="multipart/form-data"
method="post">
What is your name? <INPUT type="text" name="name_of_sender">
What files are you sending? <INPUT type="file" name="name_of_files">
</FORM>
Çë ²Î ÔÄ
[RFC1867]
À´ »ñ µÃ ¸ü ¶à µÄ ¹Ø ÓÚ ÎÄ ¼þ Ìá ½» µÄ ЊϢ.
ISINDEX ÔªËØ
ISINDEX ÊÇ ²» ÔÞ ³É µÄ. Óà »§ Ó¦ µ± ʹ Óà INPUT
Ôª ËØ À´ ´ú Ìæ Ëü.
<!ELEMENT ISINDEX - O EMPTY>
<!ATTLIST ISINDEX
%coreattrs; -- id , class , style , title --
%i18n; -- lang , dir --
prompt CDATA #IMPLIED -- prompt message -->
¿ª ʼ ±ê ¼Ç: Ðè Òª , ½á Êø ±ê ¼Ç: ½û Ö¹
ÌØ ÐÔ ¶¨ Òå
prompt = cdata
²» ÔÞ ³É. Õâ ¸ö ÌØ ÐÔ Ö¸ ¶¨ ÁË Êä Èë Óò µÄ Ìá ʾ ×Ö ·û ´®.
ISINDEX
Ôª ËØ Ê¹ µÃ Óà »§ ´ú Àí Æ÷ Ìá ʾ Óà »§ Êä Èë Ò» ¸ö ¼ò µ¥ µÄ ÐÐ (ÔÊ Ðí ÈÎ
Òâ Êý Á¿ µÄ ×Ö ·û). Óà »§ ´ú Àí Æ÷ »á ʹ ÓÃ
prompt
ÌØ ÐÔ ×÷ Ϊ Ìá ʾ µÄ ±ê Ìâ.
²» ÔÞ ³É Àý
³Ì:
Ï Ãæ µÄ
ISINDEX Éù
Ã÷:
<ISINDEX prompt="Enter your search phrase: ">
µÈ ͬ ÓÚ Ï Ãæ µÄ
INPUT Éù
ʱ:
<FORM action="..." method="post">
Enter your search phrase: <INPUT type="text">
</FORM>
ISINDEX µÄ Óï Òå ÎÊ Ìâ. Ä¿ Ç°, Ö»
ÓÐ µ± ±à Âë ÎÄ µ± µÄ »ù URL ÊÇ Ò» ¸ö HTTP URL ʱ ISINDEX
ÓÐ Æä Íê ÉÆ ¶¨ Òå µÄ Óï Òå. ÔÚ Êµ ¼ù ÖÐ, ÓÉ ÓÚ Ã» ÓÐ Æä Ëü µÄ ¿É Óà ÓÚ
URL ½á ¹¹ µÄ ²» ͬ ×Ö ·û ¼¯, Êä Èë ×Ö ´® ÊÜ Latin-1 µÄ ÏÞ ÖÆ .
BUTTON ÔªËØ
<!ELEMENT BUTTON - -
(%inline | %blocklevel)* -(A | %formctrl | FORM | ISINDEX | FIELDSET)>
<!ATTLIST BUTTON
%attrs; -- %coreattrs, %i18n, %events --
name CDATA #IMPLIED -- for scripting/forms as submit button --
value CDATA #IMPLIED -- gets passed to server when submitted --
type (submit|reset) #IMPLIED -- for use as form submit/reset button --
disabled (disabled) #IMPLIED -- control is unavailable in this context --
tabindex NUMBER #IMPLIED -- position in tabbing order --
onfocus %Script #IMPLIED -- the element got the focus --
onblur %Script #IMPLIED -- the element lost the focus --
>
¿ª ʼ ±ê ¼Ç: Ðè Òª , ½á Êø ±ê ¼Ç: Ðè Òª
ÌØ ÐÔ ¶¨ Òå
name = cdata
Õâ ¸ö ÌØ ÐÔ Îª °´ Å¥ ·Ö Åä Ò» ¸ö Ãû ³Æ.
value = cdata
Õâ ¸ö ÌØ ÐÔ Îª °´ Å¥ ·Ö Åä Ò» ¸ö Öµ.
type = button|submit|reset
Õâ ¸ö ÌØ ÐÔ Éù Ã÷ ÁË °´ Å¥ ÐΠʽ. µ± Õâ ¸ö ÌØ ÐÔ Ã» ÓÐ ±» Éè ¶¨ ʱ, Õâ
¸ö °´ Å¥ ÐРΪ ÊÇ Î´ ¶¨ Òå µÄ . ¿É ÄÜ µÄ Öµ Ϊ:
button: ½¨ Á¢ Ò» ¸ö ´ò Ëã ¼¤ ·¢ ½Å ±¾ µÄ °´ Å¥.
submit: ½¨ Á¢ Ò» ¸ö Ìá ½» Õû ·Ý ±í µ¥ µÄ °´ Å¥. Õâ ÊÇ È± Ê¡ Öµ.
reset: ½¨ Á¢ Ò» ¸ö ¸´ λ Õû ·Ý ±í µ¥ µÄ °´ Å¥.
ÔÚ Ëü ´¦ ¶¨ Òå µÄ ÌØ ÐÔ
disabled (¿Ø¼þ½ûÖ¹ÊäÈë )
tabindex (ÖƱí¼üµ¼º½ )
usemap (¿Í»§¶ËͼÏñÓ³Ïñ )
onfocus , onblur
(ÄÚ²¿Ê¼þ )
onclick , ondblclick ,
onmousedown , onmouseup ,
onmouseover , onmousemove ,
onmouseout , onkeypress ,
onkeydown , onkeyup
(ÄÚ²¿Ê¼þ )
Ò» ¸ö ¸ñ ʽ Ϊ "sbumint" µÄ
BUTTON
Ôª ËØ Óë Ò» ¸ö ¸ñ ʽ Ϊ "submit" µÄ
INPUT
Ôª ËØ Ïà µ± ½ü ËÆ. Ëü ÃÇ Á½ Õß ¶¼ Òý Æð ±í µ¥ µÄ Ìá ½», µ«
BUTTON
Ôª ËØ ÔÊ Ðí ¸ü ·á ¸» µÄ Õ¹ ÏÖ ¿É ÄÜ ÐÔ.
Ò» ¸ö ¸ñ ʽ Ϊ "submit" ÇÒ ÄÚ ÈÝ Îª Ò» ÕŠͼ Ïñ (Èç IMG
Ôª ËØ) µÄ BUTTON Ôª ËØ ·Ç
³£ ½ü ËÆ ÓÚ Ò» ¸ö ¸ñ ʽ Ϊ "image" µÄ INPUT
Ôª ËØ. Á½ Õß ¶¼ Òý Æð ±í µ¥ µÄ Ìá ½», µ« Ëü ÃÇ µÄ ±í ÏÖ ²» ͬ. ÔÚ Õâ ÖÖ
ÉÏ ÏÂ ÎÄ ÖÐ, Ò» ¸ö INPUT Ôª
ËØ ±» ´ò Ëã ×÷ Ϊ Ò» ¸ö "flat" ͼ Ïñ äÖ È¾, ¶ø Ò» ¸ö BUTTON
±» ´ò Ëã ×÷ Ϊ Ò» ¸ö °´ Å¥ äÖ È¾ (Àý Èç µ± µ¥ »÷ ʱ µÄ »º ¶¯ ºÍ ÉÏ/Ï Òõ
Ó°).
Ï Ãæ µÄ Àý ³Ì ͨ ¹ý
BUTTON
°´ Å¥ ʵ Àý ´ú Ìæ ½¨ Á¢ Ìá ½» ºÍ ¸´ λ °´ Å¥ µÄ
INPUT
Ôª ËØ À´ À© Õ¹ ÁË Ç° Àý. Õâ ¸ö °´ Å¥ ͨ ¹ý
IMG
Ôª ËØ À´ °ü º¬ ͼ Ïñ.
<FORM action="http://somesite.com/prog/adduser" method="post">
<P>
First name: <INPUT type="text" name="firstname"><BR>
Last name: <INPUT type="text" name="lastname"><BR>
email: <INPUT type="text" name="email"><BR>
<INPUT type="radio" name="sex" value="Male"> Male<BR>
<INPUT type="radio" name="sex" value="Female"> Female<BR>
<BUTTON name="submit" value="submit" type="submit">
Send<IMG src="/icons/wow.gif" alt="wow"></BUTTON>
<BUTTON name="reset" type="reset">
Reset<IMG src="/icons/oops.gif" alt="oops"></BUTTON>
</FORM>
Èç ¹û Ò» ¸ö
BUTTON
Óë
IMG Ôª ËØ Ò» Æð
ʹ ÓÃ. ÎÒ ÃÇ ½¨ Òé ²É ÓÃ
IMG
Ôª ËØ µÄ
alt ÌØ ÐÔ
À´ Ìá ¹© Ò» ¸ö Ãè Êö ¸ø ¿´ ²» µ½ Õâ ¸ö ͼ Ïñ µÄ Óà »§.
°Ñ Ò» ¸ö ͼ Ïñ Ó³ Ïñ Óë Ò» ¸ö ×÷ Ϊ BUTTON
Ôª ËØ ÄÚ ÈÝ µÄ IMG
Áª ϵ Æð À´ ÊÇ ·Ç ·¨ µÄ.
·Ç ·¨ Àý ³Ì:
Ï Ãæ µÄ ²» ÈÏ Îª ÊÇ ºÏ ·¨ µÄ HTML
<BUTTON>
<IMG src="foo.gif" usemap="...">
</BUTTON>
Ò» ¸ö ¸ñ ʽ Ϊ "reset" µÄ BUTTON
Ôª ËØ Óë Ò» ¸ö ¸ñ ʽ Ϊ "reset" µÄ INPUT
Ôª ËØ Ïà µ± ½ü ËÆ. Á½ ÖÖ Çé ¿ö ¶¼ ¿Ø ÖÆ ÖØ Ð »ñ µÃ ³õ ʼ Öµ, µ« BUTTON
Ôª ËØ Ô¼ Ðí ¸ü ·á ¸» µÄ Õ¹ ÏÖ.
BUTTON Ôª ËØ Ò² ÄÜ ¹»
Óë ½Å ±¾ ¹² ͬ ʹ ÓÃ, ÔÚ Õâ ÖÖ Çé ¿ö Ï Ëü µÄ type
Ó¦ µ± Ϊ "button". µ± Õâ Ñù µÄ Ò» ¸ö °´ Å¥ ±» ¼¤ »î ʱ, Ò» ¸ö ¿Í »§ ¶Ë
½Å ±¾ ±» ÔË ÐÐ. ÎÒ ÃÇ ÔÚ Õâ ¸ö ˵ Ã÷ Êé µÄ ºó Ãæ µÄ ÄÚ²¿Ê¼þ
Õ ½Ú ÌÖ ÂÛ BUTTON µÄ ʹ
ÓÃ.
SELECT ºÍ OPTION
ÔªËØ
<!ELEMENT SELECT - - (OPTION+)>
<!ATTLIST SELECT
%attrs; -- %coreattrs, %i18n, %events --
name CDATA #REQUIRED -- field name --
size NUMBER #IMPLIED -- rows visible --
multiple (multiple) #IMPLIED -- default is single selection --
disabled (disabled) #IMPLIED -- control is unavailable in this context --
tabindex NUMBER #IMPLIED -- position in tabbing order --
onfocus %Script #IMPLIED -- the element got the focus --
onblur %Script #IMPLIED -- the element lost the focus --
onselect %Script #IMPLIED -- some text was selected --
onchange %Script #IMPLIED -- the element value was changed --
>
¿ª ʼ ±ê ¼Ç: Ðè Òª , ½á Êø ±ê ¼Ç: Ðè Òª
SELECT ÌØ ÐÔ ¶¨ Òå
name = cdata
Õâ ¸ö ÌØ ÐÔ Îª Ôª ËØ ·Ö Åä Ò» ¸ö Ãû ³Æ. Õâ ¸ö Ãû ³Æ ½« ÔÚ ±í µ¥ ±» Ìá ½»
ʱ Óë Ñ¡ ¶¨ µÄ Öµ ³É ¶Ô.
size = integer
Õâ ¸ö ÌØ ÐÔ Ö¸ ¶¨ ±» Óà À´ ´ú Àí Æ÷ äÖ È¾ µÄ ºá ÐÐ µÄ Êý Ä¿. ºá ÐÐ µÄ Êý
Ä¿ ¿É ÒÔ Ð¡ ÓÚ ¿É ÄÜ µÄ Ñ¡ Ôñ µÄ Êý Ä¿. Õâ Õâ ÖÖ Çé ¿ö ÏÂ, Óà »§ ´ú Àí
»á Ìá ¹© Ò» ¸ö ¹ö ¶¯ »ú ¹¹ ÒÔ ±ã ´¦ Àí Ëù ÓÐ ¿É ÄÜ µÄ Ñ¡ Ôñ.
multiple
µ± Éè ¶¨ µÄ ʱ ºò, Õâ ¸ö ²¼ ¶û Öµ ÔÊ Ðí ¶à Ñ¡ Ïî. ¶ø ÔÚ Ã» ÓÐ Éè ¶¨ ʱ,
SELECT Ôª ËØ Ö» ÔÊ Ðí µ¥
¸ö Ñ¡ Ôñ. µä ÐÍ µØ, ¿É ÊÓ Óà »§ ´ú Àí Æ÷ ÒÔ ÁÐ ±í ¿ò äÖ È¾ ¶à Ñ¡ Ôª ËØ,
¶ø ÒÔ Ï À ¿ò äÖ È¾ µ¥ Ñ¡ Ôª ËØ.
SELECT Ôª ËØ ½¨ Á¢ Ò» ¸ö
¿É ±» ¿É »§ Ñ¡ Ôñ µÄ Ñ¡ Ïî Àý ±í. ÿ ¸ö
SELECT
Ôª ËØ ±Ø Ðë °ü º¬ Ò» ¸ö Ñ¡ Ôñ. ÿ ¸ö Ñ¡ Ôñ ͨ ¹ý Ò» ¸ö
OPTION
Ôª ËØ Êµ Àý À´ Ö¸ ¶¨.
<!ELEMENT OPTION - O (#PCDATA)*>
<!ATTLIST OPTION
%attrs; -- %coreattrs, %i18n, %events --
selected (selected) #IMPLIED
disabled (disabled) #IMPLIED -- control is unavailable in this context --
value CDATA #IMPLIED -- defaults to element content --
>
¿ª ʼ ±ê ¼Ç: Ðè Òª , ½á Êø ±ê ¼Ç: ¿É Ñ¡
OPTION ÌØ ÐÔ ¶¨ Òå
selected
µ± Éè ¶¨ ʱ, Õâ ¸ö ²¼ ¶û ÌØ ÐÔ Ö¸ ¶¨ ÁË Õâ ¸ö Ñ¡ Ïî ÊÇ Ñ¡ ¶¨ µÄ (³õ ʼ
»ò ͨ ¹ý Óà »§).
value = cdata
Õâ ¸ö ÌØ ÐÔ Ö¸ ¶¨ ÁË Èç ¹û Õâ ¸ö Ñ¡ Ôñ ±» Ñ¡ ÖÐ ºó Óë ±í µ¥ Ìá ½» ʱ Ìá
½» µÄ Öµ. Õâ ¸ö Öµ Óë ·Ö Åä ¸ø SELECT
Ôª ËØ µÄ name e Åä ¶Ô. Èç ¹û Õâ ¸ö ÌØ ÐÔ Ã» ÓÐ Éè ¶¨, ȱ Ê¡ Ìá
½» Öµ Ϊ OPTION Ôª ËØ µÄ
ÄÚ ÈÝ.
ÔÚ Ëü ´¦ ¶¨ Òå µÄ ÌØ ÐÔ
id , class
(¹ã·ºµÄÎĵµ±êʶ·û )
lang (ÓïÑÔÐÅÏ¢ ),
dir (ÎÄ×Ö·½Ïò )
title (ÔªËرêÌâ )
style (ÄÚ²ã·ç¸ñÖ»ÐíÐÅÏ¢ )
disabled (¿Ø¼þ½ûÖ¹ÊäÈë )
tabindex (ÖƱí¼üµ¼º½ )
onfocus , onblur ,
onchange (ÄÚ²¿Ê¼þ )
onclick , ondblclick ,
onmousedown , onmouseup ,
onmouseover , onmousemove ,
onmouseout , onkeypress ,
onkeydown , onkeyup
(ÄÚ²¿Ê¼þ )
Óà »§ Ó¦ µ± °Ñ
OPTION
Ôª ËØ µÄ ÄÚ ÈÝ Óà À´ ÏÔ Ê¾ Ñ¡ Ôñ Ïî.
ÔÚ ´Ë Àý ÖÐ, ÎÒ ÃÇ ½¨ Á¢ Ò» ¸ö Ï À ¿ò ÔÊ Ðí Óà »§
À´ Ñ¡ Ôñ Æß ¸ö Èí ¼þ ×é ¼þ À´ °² ×°. µÚ Ò» ºÍ µÚ ¶þ ¸ö ×é ¼þ ³õ ʼ ±» Ñ¡
ÖÐ µ« Ò² ¿É ÒÔ ±» Óà »§ È¡ Ïû. Ê£ Ï µÄ ×é ¼þ ÔÚ ³õ ʼ ÖРû ÓÐ ±» Ñ¡ ÖÐ.
size ÌØ ÐÔ Ê¹ µÃ ÏÂ
À ¿ò ÏÔ Ê¾ 4 ¸ö ºá ÐÐ ¶ø Óà »§ Òª ÔÚ 7 ¸ö Ñ¡ Ïî ÖÐ Ñ¡ Ôñ. Æä Ëü µÄ Ñ¡
Ïî ¿É ÒÔ Í¨ ¹ý ¹ö ¶¯ »ú ÖÆ À´ ʵ ÏÖ.
SELECT ºó ¸ú Ìá Ìá ½»
Óë ¸´ λ °´ Å¥.
<FORM action="http://somesite.com/prog/component-select" method="post">
<SELECT multiple size="4" name="component-select">
<OPTION selected value="Component_1_a">Component_1</OPTION>
<OPTION selected value="Component_1_b">Component_2</OPTION>
<OPTION>Component_3</OPTION>
<OPTION>Component_4</OPTION>
<OPTION>Component_5</OPTION>
<OPTION>Component_6</OPTION>
<OPTION>Component_7</OPTION>
</SELECT>
<INPUT type="submit" value="Send"><INPUT type="reset">
</FORM>
µ± ±í µ¥ ±» Ìá ¹© ʱ, ÿ ¸ö Ñ¡ Ôñ Ïî Ä¿ ½« Óë "component-select" Ãû ³Æ
³É ¶Ô ²¢ Ìá ½». Ìá ½» µÄ ÿ ¸ö
OPTION
µÄ Öµ Ôò ÊÇ Ëü µÄ ·ç ÈÝ, ³ý ·Ç ÔÚ ÄÄ Àï ʹ Óà ÁË
value ÌØ ÐÔ À´
¸² ¸Ç Ëü (Õâ Àï µÄ Ç° Á½ ¸ö ×é ¼þ).
TEXTAREA ÔªËØ
<!ELEMENT TEXTAREA - - (#PCDATA)*>
<!ATTLIST TEXTAREA
%attrs; -- %coreattrs, %i18n, %events --
name CDATA #REQUIRED
rows NUMBER #REQUIRED
cols NUMBER #REQUIRED
disabled (disabled) #IMPLIED -- control is unavailable in this context --
readonly (readonly) #IMPLIED
tabindex NUMBER #IMPLIED -- position in tabbing order --
onfocus %Script #IMPLIED -- the element got the focus --
onblur %Script #IMPLIED -- the element lost the focus --
onselect %Script #IMPLIED -- some text was selected --
onchange %Script #IMPLIED -- the element value was changed --
>
¿ª ʼ ±ê ¼Ç: Ðè Òª , ½á Êø ±ê ¼Ç: Ðè Òª
ÌØ ÐÔ ¶¨ Òå
name = cdata
Õâ ¸ö ÌØ ÐÔ °Ñ Ò» ¸ö Ãû ³Æ ·Ö Åä ¸ø Ôª ËØ. Õâ ¸ö Ãû ³Æ ½« ÔÚ Ôª ËØ ±» Ìá
½» µ½ ·þ Îñ Æ÷ ʱ Óë Æä ÄÚ ÈÝ ³É ¶Ô.
rows = integer
Ö¸ ¶¨ ¿É ¼û µÄ ÎÄ ×Ö ÐÐ µÄ Êý Ä¿. Óà »§ Ó¦ µ± ÄÜ ¹» Êä Èë ³¬ ¹ý Õâ ¸ö Êý
Á¿ µÄ ÐÐ, Ëù ÒÔ Óà »§ ´ú Àí Æ÷ Ó¦ µ± Ìá ¹© ij Щ µ± ÄÚ ÈÝ ³¬ ¹ý ¿É ÊÓ Çø
Óò ʱ ÔÚ textarea ÖÐ ¹ö ¶¯ ÄÚ ÈÝ µÄ ·½ ·¨.
cols = integer
Ö¸ ¶¨ ¿É ÊÓ ×Ö ·û ¿í ¶È. Óà »§ µÄ Êä Èë Ó¦ µ± ÄÜ ¹» ±È Ö® ¸ü ³¤, Ëù ÒÔ
Óà »§ ´ú Àí Æ÷ Ó¦ µ± ÔÚ Æä ÄÚ ÈÝ ³¬ ¹ý ¿É ÊÓ Çø Óò ʱ Ìá ¹© ij Щ ¹ö ¶¯
textarea Óò ÄÚ ÈÝ µÄ ·½ ·¨. Óà »§ ´ú Àí Æ÷ ¿É ÒÔ ¶Ô ¿É ÊÓ ÎÄ ×Ö ½ø ÐÐ ÕÛ
ÐÐ À´ ±£ ³Ö ³¤ Ãû ¶ø ÎÞ Ðè ¹ö ¶¯.
ÔÚ Ëü ´¦ ¶¨ Òå µÄ ÌØ ÐÔ
id , class
<<<<<<< forms.src (¹ã·ºµÄÎĵµ±êʶ·û )
lang (ÓïÑÔÐÅÏ¢ ),
dir (ÎÄ×Ö·½Ïò )
title (ÔªËرêÌâ )
style (ÄÚ²ã·ç¸ñÖ»ÐíÐÅÏ¢ )
readonly (read-only
input controls )
disabled (¿Ø¼þ½ûÖ¹ÊäÈë )
tabindex (ÖƱí¼üµ¼º½ )
onfocus , onblur ,
onselect , onchange
(ÄÚ²¿Ê¼þ )
onclick , ondblclick ,
onmousedown , onmouseup ,
onmouseover , onmousemove ,
onmouseout , onkeypress ,
onkeydown , onkeyup
(ÄÚ²¿Ê¼þ )
TEXTAREA
Ôª ËØ ½¨ Á¢ Ò» ¸ö ¶à ÐÐ ÎÄ ±¾ Êä Èë ¿Ø ¼þ (Ïà ¶Ô ÓÚ µ¥ ÐÐ
INPUT
¿Ø ¼þ). Õâ ¸ö Ôª ËØ µÄ ÄÚ ÈÝ Ìá ¹© ¿Ø ¼þ Õ¹ ÏÖ µÄ ³õ ʼ ÎÄ ±¾.
Õâ ¸ö Àý ³Ì ½¨ Á¢ Ò» ¸ö
TEXTAREA
¿Ø ¼þ °ü º¬ 20 ÐÐ ºÍ 80 ÁÐ ²¢ ÇÒ ÓÐ Á½ ÐÐ ³õ ʼ ÎÄ ×Ö.
TEXTAREA
ºó ¸ú Ìá ½» ºÍ ¸´ λ °´ Å¥.
<FORM action="http://somesite.com/prog/text-read" method="post">
<TEXTAREA rows="20" cols="80">
First line of initial text.
Second line of initial text.
</TEXTAREA>
<INPUT type="submit" value="Send"><INPUT type="reset">
</FORM>
Éè ÖÃ
readonly
ÌØ ÐÔ ÔÊ Ðí ×÷ Õß ÔÚ
TEXTAREA
ÏÔ Ê¾ ²» ¿É ÐÞ ¸Ä µÄ ÎÄ ±¾. Õâ ²» ͬ ÓÚ ÔÚ ÎÄ µµ ÖРʹ Óà ±ê ×¼ ±ê ×¢ ÎÄ
±¾ Òò Ϊ
TEXTAREA µÄ Öµ
Óë ±í µ¥ Ò» Æð ±» Ìá ½».
µ± Ìá ½» Óò ÄÚ ÈÝ Ê± ½¨ Òé Óà »§ ´ú Àí Æ÷ ×ñ ÕÕ CR, LF (ASCII 10 ½ø
ÖÆ 13, 10) ÐÐ ½á Êø ×¼ Ôò. Ìá ½» Êý ¾Ý µÄ ×Ö ·û ¼¯ Ó¦ µ± Ϊ ISO Latin-1,
³ý ·Ç ·þ Æ÷ Æ÷ Ô¤ ÏÈ Ö¸ ¶¨ ¿É ÒÔ Ö§ ³Ö ÂÖ Ìæ µÄ ×Ö ·û ¼¯.
LABEL ÔªËØ
<!ELEMENT LABEL - - (%inline)* -(LABEL) -- field label text -->
<!ATTLIST LABEL
%attrs; -- %coreattrs, %i18n, %events --
for IDREF #IMPLIED -- matches field ID value --
disabled (disabled) #IMPLIED -- control is unavailable in this context --
accesskey CDATA #IMPLIED -- accessibility key character --
onfocus %Script #IMPLIED -- the element got the focus --
onblur %Script #IMPLIED -- the element lost the focus --
>
¿ª ʼ ±ê ¼Ç: Ðè Òª , ½á Êø ±ê ¼Ç: Ðè Òª
ÌØ ÐÔ ¶¨ Òå
for = control-name
Õâ ¸ö ÌØ ÐÔ ÏÔ Ê½ µØ °Ñ ¶¨ Òå µÄ ±ê Ç© Áª ϵ µ½ Áí Ò» ¸ö ¿Ø ¼þ. Õâ ¸ö ÌØ
ÐÔ µÄ Öµ ±Ø Ðë ÊÇ ÔÚ Í¬ Ò» ¸ö ÎÄ µµ ÖÐ µÄ ij Щ id
ÌØ ÐÔ µÄ Öµ. µ± Õâ ¸ö ÌØ ÐÔ ²» ´æ ÔÚ Ê±, ±ê Ç© ¶¨ Òå Óë Ëü µÄ ÄÚ ÈÝ ÓÐ
¹Ø.
ÔÚ Ëü ´¦ ¶¨ Òå µÄ ÌØ ÐÔ
id , class
(¹ã·ºµÄÎĵµ±êʶ·û )
lang (ÓïÑÔÐÅÏ¢ ),
dir (ÎÄ×Ö·½Ïò )
title (ÔªËرêÌâ )
style (ÄÚ²ã·ç¸ñÖ»ÐíÐÅÏ¢ )
disabled (¿Ø¼þ½ûÖ¹ÊäÈë )
accesskey (Èȼü )
tabindex (ÖƱí¼üµ¼º½ )
onclick ,onfocus ,
onblur (ÄÚ²¿Ê¼þ )
onclick , ondblclick ,
onmousedown , onmouseup ,
onmouseover , onmousemove ,
onmouseout , onkeypress ,
onkeydown , onkeyup
(ÄÚ²¿Ê¼þ )
LABEL
Ôª ËØ ¿É ÒÔ ±» Óà À´ ½Ó Á¬ ЊϢ µ½ Æä Ëü µÄ ¿Ø ¼þ Ôª ËØ (ÅÅ ³ý Æä Ëü
LABEL
Ôª ËØ). ±ê Ç© ¿É ÒÔ ±» Óà »§ ´ú Àí Æ÷ ÒÔ Êý ¸ö ·½ ·¨ äÖ È¾ (Èç ¿É ÊÓ µÄ,
±» Óï µ¥ »ú ¹¹ ¶Á ³ö, µÈ µÈ)
µ± Ò» ¸ö LABEL Ôª ËØ µÃ
µ½ ½¹ µã ʱ, Ëü °Ñ ½¹ µã ´« ËÍ µ½ Óë Ö® Ïà ¹Ø µÄ ¿Ø ¼þ. ²é ¼û Ï Ãæ µÄ
access keys Õ ½Ú Àý ³Ì.
Ϊ ÁË ÏÔ Ê½ µØ °Ñ Ò» ¸ö ±ê Ç© Áª ϵ µ½ ¿Ø ¼þ, ²Î ¼û LABEL
µÄ for ÌØ ÐÔ.
Õâ ¸ö Àý ³Ì ½¨ Á¢ Ò» ¸ö ±í ¸ñ À´ ¶Ô Æë Á½ ¸ö
INPUT
¿Ø ¼þ ÒÔ ¼° Ïà Ó¦ µÄ ¹Ø Áª ±ê Ç©. ÿ ¸ö ±ê Ç© µ½ ÏÔ Ê½ µØ Áª ½Ó µ½ Ò» ¸ö
INPUT Ôª ËØ.
<FORM action="..." method="post">
<TABLE>
<TR>
<TD><LABEL for="fname">First Name</LABEL>
<TD><INPUT type="text" name="firstname" id="fname">
<TR>
<TD><LABEL for="lname">Last Name</LABEL>
<TD><INPUT type="text" name="lastname" id="lname">
</TABLE>
<FORM>
Õâ ¸ö Àý ³Ì ÒÔ °ü º¬
LABEL
Ôª ËØ À© Õ¹ ÁË Ç° Àý. ×¢ Òâ
LABEL
Ôª ËØ Í¨ ¹ý
id ÌØ ÐÔ
Óë
INPUT Ôª ËØ Áª ½Ó.
<FORM action="http://somesite.com/prog/adduser" method="post">
<P>
<LABEL for="firstname">First name: </LABEL><INPUT
type="text" id="firstname"><BR>
<LABEL for="lastname">Last name: </LABEL><INPUT
type="text" id="lastname"><BR>
<LABEL for="email"email: </LABEL><INPUT
type="text" id="email"><BR>
<INPUT type="radio" name="sex" value="Male"> Male<BR>
<INPUT type="radio" name="sex" value="Female"> Female<BR>
<INPUT type="submit" value="Send"> <INPUT type="reset">
</FORM>
Ò» ¸ö ÒÔ ÉÏ µÄ
LABEL
¿É ÒÔ Í¨ ¹ý
for ÌØ ÐÔ ½¨ Á¢
¶à ²Î ÕÕ ±» Áª ½Ó µ½ ͬ Ò» ¸ö ¿Ø ¼þ.
Ϊ ÁË Òþ ʽ µØ °Ñ Ò» ¸ö ±ê Ç© Áª ϵ µ½ Áí Ò» ¸ö ¿Ø ¼þ, À´ ¿Ø ÖÆ LABEL
µÄ ÄÚ ÈÝ. Õâ ÖÖ Çé ¿ö ÏÂ, LABEL
Ö» ¿É ÒÔ °ü º¬ Ò» ¸ö Æä Ëü ¿Ø ¼þ Ôª ËØ. ±ê Ç© ±¾ Éí ¿É ÒÔ ÔÚ Áª ϵ ¿Ø ¼þ
µÄ Ç° Ãæ »ò ºó Ãæ.
ÔÚ ´Ë Àý ÖÐ, ÎÒ ÃÇ Òþ ʽ µØ °Ñ Á½ ¸ö ±ê Ç© Áª ϵ µ½
Á½ ¸ö
INPUT Ôª ËØ. ×¢ Òâ Òþ
ʽ ·½ ·¨ ×è Ö¹ ÎÒ ÃÇ ÔÚ ±í ¸ñ ÖÐ »® ·Ö ±ê Ç© ºÍ Óë Ö® Ïà ¹Ø µÄ ¿Ø ¼þ (²Î
¼û Ç° Àý).
<FORM action="..." method="post">
<LABEL>
First Name
<INPUT type="text" name="firstname">
</LABEL>
<LABEL>
<INPUT type="text" name="lastname">
Last Name
</LABEL>
</FORM>
FIELDSET ºÍ LEGEND
ÔªËØ
<!--
#PCDATA is to solve the mixed content problem,
per specification only whitespace is allowed there!
-->
<!ELEMENT FIELDSET - - (#PCDATA,LEGEND,%block)>
<!ATTLIST FIELDSET
%attrs; -- %coreattrs, %i18n, %events --
>
<!ELEMENT LEGEND - - (%inline;)+>
<!ENTITY % LAlign "(top|bottom|left|right)">
<!ATTLIST LEGEND -- fieldset legend --
%attrs; -- %coreattrs, %i18n, %events --
align %LAlign; #IMPLIED -- relative to fieldset --
accesskey CDATA #IMPLIED -- accessibility key character --
>
¿ª ʼ ±ê ¼Ç: Ðè Òª , ½á Êø ±ê ¼Ç: Ðè Òª
LEGEND ÌØ ÐÔ ¶¨ Òå
align = top|bottom|left|right
Õâ ¸ö ÌØ ÐÔ Ö¸ ¶¨ ÁË ±ê Ç© Ïà ¶Ô ÓÚ Óò Éè Öà µÄ ¶Ô Æë λ ÖÃ. ¿É ÄÜ µÄ Öµ
Ϊ:
top: ±ê Ç© ÔÚ Óò Éè ¶¨ µÄ ÉÏ ¶Ë. Õâ ÊÇ È± Ê¡ Öµ.
bottom: ±ê Ç© ÔÚ Óò Éè ¶¨ µÄ Ï ¶Ë.
left: ±ê Ç© ÔÚ Óò Éè ¶¨ µÄ ×ó ¶Ë.
right: ±ê Ç© ÔÚ Óò Éè ¶¨ µÄ ÓÒ ¶Ë.
ÔÚ Ëü ´¦ ¶¨ Òå µÄ ÌØ ÐÔ
id , class
(¹ã·ºµÄÎĵµ±êʶ·û )
lang (ÓïÑÔÐÅÏ¢ ),
dir (ÎÄ×Ö·½Ïò )
title (ÔªËرêÌâ )
style (ÄÚ²ã·ç¸ñÖ»ÐíÐÅÏ¢ )
accesskey (Èȼü )
align (alignment )
onclick , ondblclick ,
onmousedown , onmouseup ,
onmouseover , onmousemove ,
onmouseout , onkeypress ,
onkeydown , onkeyup
(ÄÚ²¿Ê¼þ )
FIELDSET
Ôª ËØ ±í µ¥ Éè ¼Æ Õß ¼¼ Êõ ÐÔ ¶Ô °Ñ ¿Ø ¼þ ³É ×é. ³É ×é ¿Ø ¼þ ʹ Óà »§ ¸ü
ÈÝ Ò× Ã÷ °× Ëü ÃÇ µÄ Òâ ͼ ͬ ʱ Ò² ¿É ÒÔ °ï Öú ¿É ÊÓ Óà »§ ´ú Àí Æ÷ ºÍ
Ãæ Ïò Óï Òô µÄ Óï Òô µ¼ º½ Óà »§ ´ú Àí Æ÷. Õâ Щ Ôª ËØ µÄ ÊÊ µ± ʹ Óà ʹ
µÃ ÓÐ ²Ð ¼² µÄ ÈË ÃÇ ¸ü Ò× ÓÚ ²Ù ×÷.
LEGEND Ôª ËØ ÔÊ Ðí Éè
¼Æ Õß Îª Ò» ¸ö FIELDSET
·Ö Åä Ò» ¸ö ±ê Ç©. µ± FIELDSET
±» äÖ È¾ Ϊ ²» ¿É ÊÓ Ê± Ëü Ìá ¸ß ÁË ´¦ Àí ÄÜ Á¦. µ± äÖ È¾ Ϊ ¿É ÊÓ Ê±,
Éè ¶¨ LEGEND Ôª ËØ µÄ align
ÌØ ÐÔ ¿É ÒÔ Ê¹ Ö® ¶Ô Æë ÓÚ FIELDSET .
ÔÚ ´Ë Àý ³Ì ÖÐ, ÎÒ ÃÇ ½¨ Á¢ Ò» ÖÖ ½« ÔÚ Ò½ Éú °ì ¹« ÊÒ Ìî д µÄ ±í
µ¥. Ëü ±» ·Ö ³É Èý ²¿ ·Ö: ¸ö ÈË ÐŠϢ, ²¡ Ê· ºÍ Ä¿ Ç° ²¡ Àú. ÿ ¸ö ²¿ ·Ö
°ü º¬ ¶Ô Êä Èë ÊÊ µ± µÄ ЊϢ µÄ ¿Ø ÖÆ.
<FORM action="..." method="post">
<FIELDSET>
<LEGEND align="top">Personal Information</LEGEND>
Last Name: <INPUT name="personal_lastname" type="text" tabindex="1">
First Name: <INPUT name="personal_firstname" type="text" tabindex="2">
Address: <INPUT name="personal_address" type="text" tabindex="3">
...more personal information...
</FIELDSET>
<FIELDSET>
<LEGEND align="top">Medical History</LEGEND>
<INPUT name="history_illness"
type="checkbox"
value="Smallpox" tabindex="20"> Smallpox</INPUT>
<INPUT name="history_illness"
type="checkbox"
value="Mumps" tabindex="21"> Mumps</INPUT>
<INPUT name="history_illness"
type="checkbox"
value="Dizziness" tabindex="22"> Dizziness</INPUT>
<INPUT name="history_illness"
type="checkbox"
value="Sneezing" tabindex="23"> Sneezing</INPUT>
...more medical history...
</FIELDSET>
<FIELDSET>
<LEGEND align="top">Current Medication</LEGEND>
Are you currently taking any medication?
<INPUT name="medication_now"
type="radio"
value="Yes" tabindex="35">Yes</INPUT>
<INPUT name="medication_now"
type="radio"
value="No" tabindex="35">No</INPUT>
If you are currently taking medication, please indicate
it in the space below:
<TEXTAREA name="current_medication"
rows="20" cols="50"
tabindex="40">
</TEXTAREA>
</FIELDSET>
</FORM>
×¢ Òâ ÔÚ ´Ë Àý ÖÐ, ÎÒ ÃÇ ¿É ÒÔ Í¨ ¹ý ÔÚ Ã¿ ¸ö ÔÚ
FIELDSET
ÖÐ ¶Ô Æë Ôª ËØ (ͨ ¹ý ·ç ¸ñ Ò³), ¼Ó Èë ½Å ±¾ ( ¾Í ÊÇ Ëµ, Ö» ÓÐ µ± Ëû »ò
Ëý ´ò ¿ª "current medication" ÎÄ ±¾ Çø Óò ±í ʾ »¹ ÔÚ Óà ҩ ÖÐ) µÈ µÈ À´
Ìá ¸ß ±í µ¥ µÄ Õ¹ ÏÖ.
¸øÒ»¸öÔªËؽ¹µã
ÔÚ HTML »î ¶¯ Ôª ËØ ±Ø Ðë ÓÉ ÓÚ Óà »§ µÄ ´ò Ëã µÄ ÈÎ Îñ ¶ø µÃ µ½ µÃ µ½
½¹ µã . Àý Èç, Óà »§ ±Ø Ðë ¼¤ »î Ò» ¸ö ÓÉ
A
Ôª ËØ Ö¸ ¶¨ µÄ Á´ ½Ó À´ ×· Ëæ Ö¸ ¶¨ µÄ Á´ ½Ó. Àà ËÆ µÄ, Óà »§ ´ú Àí Æ÷
Ϊ Êä Èë ÎÄ ×Ö ¶ø ¸ø Ò» ¸ö
TEXTAREA
¸³ ÓÚ ½¹ µã.
ÓÐ Êý ¸ö ·½ ·¨ °Ñ ½¹ µã ¸³ ÓÚ Ò» ¸ö Ôª ËØ:
ͨ ¹ý ¶¨ λ Éè ±¸ Ö¸ ¶¨ Ôª ËØ.
´Ó Ò» ¸ö Ôª ËØ Í¨ ¹ý ¼ü ÅÌ µ¼ º½ µ½ Ï һ ¸ö. ÎÄ µµ ×÷ Õß ¿É ÒÔ ¶¨ Òå Ò»
¸ö ÖÆ ±í ¼ü ´Î Ðò À´ Ö¸ ¶¨ Óà »§ ͨ ¹ý ¼ü ÅÌ À´ µ¼ º½ (ÖƱí¼üµ¼º½ )
µÄ »° ÄÄ ¸ö Ôª ËØ µÃ µ½ ½¹ µã. Ò» µ© Ñ¡ ÖÐ, Ò» ¸ö Ôª ËØ ¿É ÒÔ ±» Æä Ëü
µÄ ¼ü ˳ Ðò À´ ¼¤ »î.
ͨ ¹ý Ò» ϵ ÁÐ ¼ü Ê ¼þ À´ Ñ¡ Ôñ Ò» ¸ö Ôª ËØ ±» ³Æ Ϊ Ò» ¸ö Èȼü
(ÓРʱ Ò² ½Ð ×ö "¼ü ÅÌ ÈÈ ¼ü" »ò "¼ü ÅÌ ¼Ó ËÙ").
ÖƱí¼üµ¼º½
ÌØ ÐÔ ¶¨ Òå
tabindex = integer
Õâ ¸ö ÌØ ÐÔ Ö¸ ¶¨ ÁË µ± Ç° Ôª ËØ ÔÚ µ± Ç° ÎÄ µµ ÖÆ ±í ¼ü ´Î Ðò ÖÐ µÄ λ
ÖÃ. Õâ ¸ö Öµ ¿É ÒÔ ÊÇ Õý µÄ »ò ¸º µÄ Õû Êý.
ÖÆ ±í ¼ü ´Î Ðò Ö¸ ¶¨ Á˵± Óà »§ ͨ ¹ý ¼ü ÅÌ µ¼ º½ ʱ ÄÄ ¸ö Ôª ËØ ½« µÃ
µ½ ½¹ µã. ÖÆ ±í ¼ü ´Î Ðò ¿É ÒÔ ÔÚ Æä Ëü Ƕ Ì× Ôª ËØ ÖÐ ¼ä °ü º¬ Ôª ËØ.
Ó¦ µ± ±» Óà »§ ´ú Àí Æ÷ µ¼ º½ »ñ µÃ ½¹ µã µÄ Ôª ËØ ¸ù ¾Ý Ï ÁÐ Ô Ôò:
ÄÇ Ð© Ìá ¹© tabindex ÌØ
¶¨ ºÍ Ö¸ ¶¨ Õý Êý Öµ µÄ Ôª ËØ Ê× ÏÈ ±» µ¼ º½. µ¼ º½ ´Ó ¾ß ÓÐ ×î µÍ tabindex
Öµ µÄ Ôª ËØ Ïò ¾ß ÓÐ ×î ¸ß Öµ µÄ ½ø ÐÐ. Öµ ÎÞ Ðè °´ ´Î Ðò Ò² ÄÜ ÒÔ ÈÎ ºÎ
µÄ ÌØ ¶¨ Öµ ¿ª ʼ. ¾ß ÓÐ ±ê Ö¾ ÐÔ µÄ tabindex
Ôª ËØ ÔÚ Ëü ÃÇ ÏÔ Ê¾ µÄ ÎÄ µµ ÖÐ °´ ´Î Ðò ±» µ¼ º½.
ÄÇ Ð© û ÓÐ ¶¨ Òå tabindex
ÌØ ÐÔ »ò ²» Ìá ¹© Íù Ï µ¼ º½ µÄ Ôª ËØ. Õâ Щ Ôª ËØ ÒÔ Ëü ÃÇ ÔÚ ÎÄ µµ ÖÐ
µÄ ÏÔ Ê¾ ´Î Ðò ±» µ¼ º½.
ÄÇ Ð© Ìá ¹© tabindex Öµ
ºÍ ·Ö Åä ÁË µ¼ º½ Öµ µÄ Ôª ËØ ²» ²Î Óë ÖÆ ±í ¼ü µ¼ º½.
disabled µÄ Ôª ËØ ²» ²Î ¼û ÖÆ ¼Ó ¼ü µ¼ º½.
Ï Ãæ µÄ Ôª ËØ Ö§ ³Ö
tabindex
ÌØ ÐÔ:
A ,
AREA ,
OBJECT ,
INPUT ,
SELECT ,
TEXTAREA
ºÍ
BUTTON .
ÔÚ ´Ë Àý ÖÐ, ÖÆ ±í ¼ü ´Î Ðò Ϊ
BUTTON ,
È» ºó ÊÇ
INPUT Ôª ËØ(×¢ Òâ"field1"
ºÍ °´ Å¥ ¹² Ïí ¹² Ò» ¸ö ¼ü ±í ¼ü Ë÷ Òý, µ« "field1" ³ö ÏÖ ÓÚ ÎÄ µµ µÄ ºó
²¿), ×î ºó ÊÇ ÓÉ
A Ôª ËØ
½¨ Á¢ µÄ Á´ ½Ó.
<HTML>
<BODY>
...some text...
Click to go to the
<A tabindex="10" href="http://www.w3.org/">W3C Website.</A>
...some more...
<BUTTON type="button" name="get-database"
tabindex="1" onclick="get-database">
Click me to receive the current database.
</BUTTON>
...some more...
<FORM action="..." method="post">
<INPUT tabindex="1" type="text" name="field1">
<INPUT tabindex="2" type="text" name="field2">
<INPUT tabindex="3" type="submit" name="submit">
</FORM>
</BODY>
</HTML>
ÖÆ ±í ¼ü. ÔÚ Óà »§ µÄ ¶¨ Òå ÖÐ µÄ ʵ ¼Ê µÄ
¼ü ´Î Ðò Òý Æð ÖÆ ±í ¼ü µ¼ º½ »ò Ôª ËØ µÄ ¼¤ »î (Àý Èç "tab" ¼ü Óà À´ µ¼
º½ ¶ø "enter" Ôò Óë ¼¤ »î Ñ¡ ¶¨ Ôª ËØ Ïà ¹Ø).
Óà »§ ´ú Àí Æ÷ Ò² ¿É ÒÔ ¶¨ Òå Ò» ¸ö ¼ü ´Î Ðò À´ Ïà ·´ µÄ µ¼ º½ ÖÆ
±í ¼ü ´Î Ðò. µ± µ½ ´ï ÖÆ ±í ¼ü ´Î Ðò µÄ ×î ºó ( »ò ¿ª ʼ ʱ), Óà »§ ´ú
Àí Æ÷ »á ÈÆ ×ª µ½ ¿ª ʼ (»ò ½á β).
Èȼü
ÌØ ÐÔ ¶¨ Òå accesskey = cdata
Õâ ¸ö ÌØ ÐÔ ·Ö Åä Ò» ¸ö ÈÈ ¼ü ¸ø Ò» ¸ö Ôª ËØ. Ò» ¸ö ÈÈ ¼ü ÊÇ À´ ×Ô ÓÚ ÓÃ
»§ ´ú Àí Æ÷ µ± Ç° ×Ö ·û ¼¯ µÄ µ¥ ¸ö ×Ö ·û. Óà »§ ´ú Àí Æ÷ Ó¦ µ± °Ñ Õâ ¸ö
ÌØ ÐÔ ×÷ Ϊ ´ó С д ÎÞ ¹Ø À´ ¶Ô ´ý.
°´ ¶¯ Ö¸ ¶¨ ¸ø Ôª ËØ µÄ ´¦ Àí Öµ Ôò ¸³ ÓÚ ´Ë Ôª ËØ ½¹ µã. µ± Ôª ËØ ½Ó µ½
½¹ µã ʱ ¸ù ¾Ý Ôª ËØ ¼¤ »î Æä Ó¦ µ± µÄ ·½ ʽ. ͨ ¹ý
A
¶¨ Òå µÄ Á´ ½Ó ͨ ³£ ±» Óà »§ ´ú Àí Æ÷ ¸ú Ëæ, ¼¤ »î µ¥ ÏÈ Å¥ Ôò ¸Ä ±ä Öµ,
ÓÐ ½¹ µã µÄ ÎÄ ±¾ Óò Ôò ÔÊ Ðí Óà »§ Êä Èë, µÈ µÈ.
Õâ ÁÐ µÄ Ôª ËØ Ö§ ³Ö accesskey
ÌØ ÐÔ: LABEL , A ,
CAPTION ºÍ LEGEND .
Õâ ¸ö Àý ³Ì Ö¸ ¶¨ ÈÈ ¼ü "U" ¸ø Ò» ¸ö Áª ϵ ÓÚ
INPUT
¿Ø ¼þ µÄ ±ê Ç©. ¼ü Èë ÈÈ ¼ü Ôò °Ñ ½¹ µã ·¢ ËÍ µ½ ±ê Ç© ²¢ ÒÀ ´Î ¸ø Óè Ïà
¹Ø µÄ ¿Ø ¼þ. È» ºó Óà »§ ¿É ÒÔ
INPUT
Çø Óò ÖÐ Êä Èë ÎÄ ×Ö.
<FORM action="..." method="post">
<LABEL for="user" accesskey="U">
User Name
</LABEL>
<INPUT type="text" name="user">
</FORM>
ÔÚ ´Ë Àý ÖÐ, ÎÒ ÃÇ Îª Ò» ¸ö ͨ ¹ý
A
Ôª ËØ ¶¨ Òå µÄ Á´ ½Ó ·Ö Åä Ò» ¸ö ÈÈ ¼ü. ¼ü Èë ´Ë ¼ü ¿É ÒÔ °Ñ Óà »§ ´ø µ½
Áí Ò» ¸ö ÎÄ µµ, ÔÚ ´Ë Àý ÖÐ ÊÇ Ò» ¸ö Ä¿ ¼ ±í ¸ñ.
<A accesskey="C"
href="http://somplace.com/specification/contents.html">
Table of Contents</A>
ÈÈ ¼ü µÄ ʵ ÏÖ È¡ ¾ö ÓÚ Ï ²ã ϵ ͳ. Àý Èç, ÔÚ ÔË ÐÐ MS Windows µÄ »ú ¹¹
ÉÏ, ij ÈË Í¨ ³£ ¼ü Ï "alt" ¼ü ×÷ Ϊ ¶î Íâ µÄ ÈÈ ¼ü. ÔÚ Apple ϵ ͳ ÖÐ,
ij ÈË Í¨ ³£ °´ Ï "cmd" ¼ü ×÷ Ϊ ¶î Íâ µÄ ÈÈ ¼ü.
¶Ô ÓÚ ÈÈ ¼ü µÄ ´¦ Àí È¡ ¾ö ÓÚ Óà »§ ´ú Àí Æ÷. ÎÒ ÃÇ ½¨ Òé Óà »§ ÔÚ ±ê
Ç© ÖÐ °ü º¬ ÈÈ ¼ü »ò Ö¸ Ã÷ Ìá ¹© µÄ ÈÈ ¼ü. Óà »§ ´ú Àí Æ÷ »á ÒÔ Ò» ÖÖ Ç¿
µ÷ µÄ Çø ±ð ÓÚ Æä Ëü ×Ö ·û µÄ ·½ ʽ À´ äÖ È¾ ÈÈ ¼ü µÄ ½Ç É« (Àý Èç Ï »®
Ïß).
½ûÖ¹ºÍÖ»¶ÁÔªËØ
ÄÄ Àï µÄ Óà »§ Êä Èë ¶Ô ÉÏ Ï ÎÄ À´ ˵ ÊÇ ²» Ï£ Íû µÄ »ò ²» Ïà ¸É, ÄÜ ¹»
½û Ö¹ Ò» ¸ö Ôª ËØ »ò ÒÔ Ö» ¶Á ·½ ʽ äÖ È¾ Ò» ¸ö Ôª ËØ ÊÇ ÖØ Òª µÄ. Àý Èç,
ij ÈË ¿É ÄÜ Ï£ Íû ½û Ö¹ Ò» ¸ö ±í µ¥ µÄ Ìá ½» °´ Å¥ Ö± µ½ ij Щ Ðè Òª µÄ
Êý ¾Ý ±» Êä Èë. Àà Àà ËÆ µÄ, Ò» ¸ö ×÷ Õß ¿É ÄÜ Ï£ Íû °ü º¬ Ò» Ìõ Ö» ¶Á
ÎÄ ×Ö ²¢ ±Ø Ðë ÄÜ ¹» ×÷ Ϊ Ò» ¸ö Öµ Óë ±í µ¥ Ò» Æð ±» Ìá ½». Ï Ãæ µÄ ÕÂ
½Ú Ãè Êö ÁË ½û Ö¹ µÄ ºÍ Ö» ¶Á µÄ Ôª ËØ.
½ûÖ¹ÔªËØ
ÌØ ÐÔ ¶¨ Òå
disabled
µ± Ϊ Ò» ¸ö ±í µ¥ Ôª ËØ Éè ¶¨ ʱ, Õâ ¸ö ²¼ ¶û ÌØ ÐÔ ½û Ö¹ ¿Ø ¼þ ±» Óà »§
Êä Èë.
µ± Éè ¶¨ ʱ, the disabled
ÌØ ÐÔ ¾ß ÓÐ Ï ÁÐ ¶Ô Ôª ËØ µÄ Ó° Ïì:
½û Ö¹ µÄ Ôª ËØ ²» ½Ó ÊÕ ½¹ µã.
½û Ö¹ µÄ Ôª ËØ ÔÚ ÖÆ ±í ¼ü µ¼ º½ ÖÐ ±» ºö ÂÔ.
½û Ö¹ µÄ ¿Ø ¼þ µÄ Öµ ²» Óë ±í µ¥ Ò» Æð ±» Ìá ½».
Ï ÁÐ µÄ Ôª ËØ Ö§ ³Ö disabled
ÌØ ÐÔ: INPUT , TEXTAREA ,
SELECT , OPTION ,
OBJECT , LABEL
ºÍ BUTTON .
½û Ö¹ Ôª ËØ Èç ºÎ ±» äÖ È¾ È¡ ¾ö ÓÚ Óà »§ ´ú Àí Æ÷. Àý Èç, ij Щ ÓÃ
»§ ´ú Àí Æ÷ ͨ ¹ý "gray out" À´ ½û Ö¹ Ï À ¿ò Ìõ Ä¿, °´ Å¥ ±ê Ç© µÈ µÈ.
ÔÚ ´Ë Àý ÖÐ, ½û Ö¹ µÄ
INPUT
Ôª ËØ ÎÞ ·¨ ÊÕ µ½ Óà »§ Êä Èë ²¢ ÇÒ Öµ ²» Óë ±í µ¥ ±» Ìá ½».
<INPUT disabled name="fred" value="stone">
×¢ Òâ: Ψ Ò» ÄÜ ¹» ¶¯ ̬ ÐÞ ¸Ä disabled
ÌØ ÐÔ µÄ Öµ µÄ ·½ ·¨ ÊÇ Í¨ ¹ý Ò» ¶Î ½Å ±¾.
Ö»¶ÁÔªËØ
ÌØ ÐÔ ¶¨ Òå
readonly
µ± Ϊ ±í µ¥ ¿Ø ¼þ Éè ¶¨ ʱ, Õâ ¸ö ²¼ ¶û ÌØ ÐÔ ½û Ö¹ ¿Ø ¼þ µÄ ¸Ä ±ä.
readonly ÌØ ÐÔ Ö¸ ¶¨ Ôª
ËØ ÊÇ ·ñ ¿É ÒÔ ±» Óà »§ ÐÞ ¸Ä.
µ± Éè ¶¨ ʱ, readonly
ÌØ ÐÔ ¶Ô Ò» ¸ö Ôª ËØ ÓÐ Ï ÁÐ µÄ Ó° Ïì:
Ö» ¶Á Ôª ËØ »ñ µÃ ½¹ µã µ« ²» ÄÜ ±» Óà »§ ÐÞ ¸Ä.
Ö» ¶Á Ôª ËØ °ü À¨ ÖÆ ±í ¼ü µ¼ º½.
Ö» ¶Á Ôª ËØ µÄ Öµ Óë ±í µ¥ Ò» Æð ±» Ìá ½».
Ï Ãæ µÄ Ôª ËØ Ö§ ³Ö
readonly
ÌØ ÐÔ:
INPUT ,
TEXT ,
PASSWORD ºÍ
TEXTAREA .
Ö» ¶Á Ôª ËØ Èç ºÎ ±» äÖ È¾ È¡ ¾ö ÓÚ Óà »§ ´ú Àí Æ÷.
×¢ Òâ: ¶¯ ̬ ÐÞ ¸Ä readonly
ÌØ ÐÔ µÄ Öµ µÄ Ψ Ò» ·½ ·¨ ÊÇ Í¨ ¹ý Ò» ¶Î ½Å ±¾.
±íµ¥Ìá½»
ÄĸöÔªËØÖµ ±» Ìá½»ÁË
²¢ ·Ç Ëù ÓÐ Ôª ËØ ºÍ Ëü ÃÇ µÄ Öµ Óë ±í µ¥ ±» Ìá ½».
Ò» Ö ÐÔ Óà »§ ´ú Àí Æ÷ Ó¦ µ±
²» Ìá ½»:
Last Update: 29-7-1997