html表单标识详解

======================================================
注：本文源代码点此下载
======================================================

input 的种类: text, radio,checkbox, password, submit/reset, image, file, hidden, button。

</span></a></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">■</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">引子</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">表单的用处很多,于网上无处不见,当然是配合 cgi 使用为佳,所以馈下有意使用或学习 cgi</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">的话,表单设计是必需的,这一节介绍的标记不多,但其参数变化很多。一份表单的基本架构是:在</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">标记的包围下加上一种或以上的表单输入方式及一个或以上的按键。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">■</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;"><a href="http://blog.youkuaiyun.com/javazhuanzai"><span style="color: #000000;" color="#000000">▲top</span></a></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">称为表单标记,用以宣告此为表单模式,属于一个容器标记,表示其它表单标记需要在它的包围中才有效,便是其中的一个,用以设定各种输入资料的方法。它是一个空标记。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">的参数设定(常用):</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例如: action="http://www.richavenue.net/member" method="post"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">action="http://www.richavenue.net/member"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">表单通常是与 cgi 配合使用的,参数 action 便是用以指明该 cgi 程式的位置,这样此表单所填的资料才能正确传给 cgi</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">作处理。若馈下没有 cgi 以进行测试,可设定此参数为 action="mailto:your@email.com" 那样该表单所填的资料将会寄至 此电邮地址(红色部分)。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">method="post"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">传送资料给 cgi</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">的方式,可选值为 post, get。你只需记住post容许传送大量资料,但</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">get则只接受低于 1k</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">的资料,所以你若看过别人的表单原始码的话,你会发现申请表单用的是post 而搜找器用的是</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">get。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">的参数设定(常用):</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">由于其第一个参数 type</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">己有很多的选择,而不同的选择表示出不同的输入方式,且其它参数亦因此而异,故以下将独立介绍不同输入方式及其它参数设定。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">type="text"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">可选值为 <a href="http://blog.youkuaiyun.com/javazhuanzai"><span style="color: #000000;" color="#000000">text</span></a>, <a href="http://blog.youkuaiyun.com/javazhuanzai"><span style="color: #000000;" color="#000000">radio</span></a>,<a href="http://blog.youkuaiyun.com/javazhuanzai"><span style="color: #000000;" color="#000000">checkbox</span></a>, <a href="http://blog.youkuaiyun.com/javazhuanzai"><span style="color: #000000;" color="#000000">password</span></a>, <a href="http://blog.youkuaiyun.com/javazhuanzai"><span style="color: #000000;" color="#000000">submit/reset</span></a>, <a href="http://blog.youkuaiyun.com/javazhuanzai"><span style="color: #000000;" color="#000000">image</span></a>, <a href="http://blog.youkuaiyun.com/javazhuanzai"><span style="color: #000000;" color="#000000">file</span></a>, <a href="http://blog.youkuaiyun.com/javazhuanzai"><span style="color: #000000;" color="#000000">hidden</span></a>, <a href="http://blog.youkuaiyun.com/javazhuanzai"><span style="color: #000000;" color="#000000">button</span></a>。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式一: text (单行文字盒)</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例如type="text" name="age" value="20"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">align="middle" size="2" maxlength="255"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">type="text"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式为</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">text,能产生一单行文字盒,上限为 255 字元。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">name="age"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">此一单行文字盒名称,这是最重要的一个,方便 cgi 辨认由表单传来的资料,虽说可随便命名,但通常 cgi</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">程式中都有指定名称,若转用其它名称便需要修改该 cgi 程式了,名称可为没空白没特别符号的英文或数字,有大小写的分别,可以写成</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">your_age,若有访客于此表单此一文字盒填入 40 的话,那末传给 cgi 的字串便是 your_age=40。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">value="20"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">此一单行文字盒内定值。若不填写则文字盒是空白的,等待访客亲自键入,若 value="20" 的话, 20 便会出现在文字盒中,当然访客可以修改之。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">align="middle"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">可选值:top, middle,</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">bottom, left, right, texttop, baseline, absmiddle. 没太大有处。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">size="2"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">此一单行文字盒显示的长度,若馈下是采用</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">big5 编码的中文网页便要小心,同 size 的文字盒 nc 会显示得比 ie 狻长。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">maxlength="255"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">此一单行文字盒可输入字元的上限,为方便编排资料或避免错输入等,宜设定上限,例如输入电话或 icq uin 的可设为 8,年龄为 2 等。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例子:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">原始码</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">www.richavenue.net/member"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">method="post"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">请填入电话号码:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">显示结果</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">请填入电话号码:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式二: radio (单一选择)</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例如:type="radio" name="gender" value="female" align="middle" checked></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">type="radio"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式为</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">radio,能产生一单一选择,以供点选。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">name="gender"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">此一 radio 名称,参考 text 部分的说明。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">value="female"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">内定值。每一个 radio</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">必须及仅有一个 value,通常有同时采用两个或以上同 name 不同 value 的</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">radio 输入方式,可让使用使任选其一。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">align="middle"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">可选值:top, middle,</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">bottom, left, right, texttop, baseline, absmiddle。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">checked</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">设该 radio 为内定被选。同 name</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">的各个 radio 中只能有一个使用,或全不使用这参数。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例子:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">原始码</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">www.richavenue.net/member"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">method="post"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">请选性别:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">女性</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">男性</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">你喜欢吗:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">喜欢</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">不喜欢</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">不肯定</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">显示结果</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">请选性别:女性男性</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">你喜欢吗:喜欢不喜欢不肯定</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式三: checkbox (确认盒)</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例如:type="checkbox" name="idol" value="leon"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">align="right" checked></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">type="checkbox"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式为</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">checkbox,能产生一确认盒,以供剔选。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">name="idol"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">此一 checkbox</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">名称,参考 text 部分的说明。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">value="leon"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">内定值。每一个 checkbox</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">必须及仅有一个 value,当被剔选时这值便会传及 cgi,例如所传字串 idol=leon 。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">align="right"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">可选值:top, middle,</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">bottom, left, right, texttop, baseline, absmiddle。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">checked</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">设该 checkbox 为内定被选。每个</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">checkbox 都是独立的,所以每一个都可使用这参数,不像 radio。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例子:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">原始码</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">www.richavenue.net/member"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">method="post"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">你喜欢以下那些明星:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">黎明</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">酒井法子</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">郑秀文</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">bonjovi</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">显示结果</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">你喜欢以下那些明星:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">黎明酒井法子郑秀文bonjovi</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式四: password (密码输入盒)</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例如:type="password" name="pw" value="999"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">align="middle" size="5" maxlength="9"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">password 的其他参数和 text 是完全相同的,请参考 text</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">的介绍。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">两者作用不同,password 所输入的字元全以 *</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">号表示。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例子:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">原始码</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">www.richavenue.net/member"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">method="post"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">请输入姓名:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">请输入密码:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">显示结果</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">请输入姓名:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">请输入密码:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式五: submit (传送键)及 reset (清除键)</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这是表单上重要的两个按键,两者所附带的参数相同,但用处不大。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例如:type="submit" name="other_funtion" value="确定" align="middle"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">type="reset" value="清除"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">align="middle"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">type="submit"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">设定输入方式为 submit 或</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">reset。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">name="other_funtion"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">submit</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">的功能随 name 的不同而不同,须和 cgi 配合。若你只需要普通的传送键,则是其内定,不必用此参数。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">value="确定"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这个值不是输给 cgi</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">的,而是显示在按键上,可以不用,传送键的内定值为 submit</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">query,清除键的内定值为 reset。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">align="middle"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">可选值:top, middle,</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">bottom, left, right, texttop, baseline, absmiddle。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例子:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">原始码</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">www.richavenue.net/member"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">method="post"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">显示结果</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式六: image (图片按键)</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这通常用以取代 submit 及 reset 两个按键,因为由程式产生的按键并不漂亮,这 image</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">参数便容许你采用自已制造的按键。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例如:type="image" name="submit" align="bottom" src="ex_icon.gif"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">type="image"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式为 image。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">name="submit"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">所要代表的按键,可以是</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">submit, reset, 或其它。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">align="bottom"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">可选值:top, middle,</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">bottom, left, right, texttop, baseline, absmiddle。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">src="ex_icon.gif"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">按键图片来源,若此图片文件不与该 html 文件在同一目录下,请加上相对或绝对途 径。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例子:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">原始码</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">显示结果</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式七: file</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例如:type="file" name="upload" align="bottom" size="20"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">maxlength="100" accept="text/html"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">input type="file"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式为</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">image。通常用以传输文件。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">name="upload"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这文件传输的名称,用以识别之用。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">align="bottom"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">可选值:top, middle,</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">bottom, left, right, texttop, baseline, absmiddle。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">size="20"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">所显示文字盒的长度。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">maxlength="100"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">可输入字元的上限。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">accept="text/html"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">所接受的文件类别,有二十六种选择,但可不设定。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例子:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">原始码</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">www.richavenue.net/member"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">method="post"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">显示结果</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式八: hidden</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例如:type="hidden" name="id" value="6618"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">type="hidden"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式为隐藏或内定。它不会显示任何输入介面,而是一个内定值随表单一起传给 cgi,例如由 cgi</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">产生的会员号码,或传入可更改的参数以调整 cgi 而避免修改 cgi 程式码。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">name="id"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这文件传输的名称,用以识别之用。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">value="6618"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">内定值,会以如 id=6618</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">形式传给 cgi。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例子: ("hidden" 是不被显示的,所以这处多放了一个 "submit" 键,表示 hidden 之内定值会随 submit</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">键被按而传给 cgi)</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">原始码</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">www.richavenue.net/member"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">method="post"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">显示结果</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式九: button</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例如:type="button" name="useless" value="back"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">type="button"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">输入方式为一般按键。常配合</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">java script 作为其启动按键。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">name="useless"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这文件传输的名称,用处不大。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">value="back"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">按键显示名称。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例子: 其中 οnclick="history.go( -1 );return</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">true; 属 java 事件。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">原始码</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">显示结果</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">■</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;"><a href="http://blog.youkuaiyun.com/javazhuanzai"><span style="color: #000000;" color="#000000">▲top</span></a></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">是卷动选单标记,每一选项皆由所标示,把它当作围堵标记或空标记使用都可以。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">的参数设定(常用):</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例如: name="where" size="6"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">multiple></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">name="where"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这卷动选单的名称,作识别之用,将会传及 cgi。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">size="6"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这卷动选单的列数,即其高度,请自行修改。若使用此参数则不会有 pop up 效果。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">multiple</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">令这卷动选单容许多重选择。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">的参数设定(常用):</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例如: value="tw" selected></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">value="tw"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这选项的值,将会传及</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">cgi。请自行修改,但不同选项必须有不同的值。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">selected</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">设该选项为内定被选。一个单选卷动选单只能有一项或零可内定被选。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例子一: (普通 pop up 卷动选单)</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">原始码</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">www.richavenue.net/member"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">method="post"> where you com from?</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">hong kong</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">taiwan</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">china</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">united states</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">canada</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">显示结果</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">where you com from?</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">hong kong taiwan china united states canada</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例子二: (容许多重选择 的卷动选单)</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">原始码</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">www.richavenue.net/member"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">method="post"> where you com from?</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">multiple></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">hong kong</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">taiwan</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">china</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">united states</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">canada</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">显示结果</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">where you com from?</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">hong kong taiwan china united states canada</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例子三:(设定了 size 的卷动选单)</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">原始码</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">www.richavenue.net/member"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">method="post"> where you com from?</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">size="5"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">hong kong</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">taiwan</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">china</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">united states</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">canada</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">显示结果</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">where you com from?</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">hong kong taiwan china united states canada</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">■</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;"><a href="http://blog.youkuaiyun.com/javazhuanzai"><span style="color: #000000;" color="#000000">▲top</span></a></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">是表单文字区块标记,常用于 bug report, feedback 等需要填写大量资料的用途。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">的参数设定(常用):</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例如: name="comments" cols="40"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">rows="4" wrap="virtual"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">name="comments"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这文字区块的名称,作识别之用,将会传及 cgi。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">cols="40"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这文字区块的宽度,请自行修改。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">rows="4"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这文字区块的列数,即其高度,请自行修改。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">wrap="virtual"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">设定其折行问题,可选值为:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">off, physical,</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">virtual。off 表示不使用此属性,physical 时则会强迫刘览器在送资料到</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">cgi(web 伺服器端)必须将实№文字中的换行一 并送出,设为 virtual 时则送出连续成串的字(除非使用者按了键盘的 return /</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">enter)。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">例子:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">原始码</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">www.richavenue.net/member"</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">method="post"></p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">give comments:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这是预设的字句,通常留空的,随你喜欢。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">显示结果</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">give comments:</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;">这是预设的字句,通常留空的,随你喜欢。</p><p style="text-indent:2em; padding:0px; margin:0px;line-height:240%;"><a href="http://blog.youkuaiyun.com/javazhuanzai"><span style="color: #000000;" color="#000000"> </span></a></p><br>======================================================<br> <b>在最后，我邀请大家参加新浪APP，就是新浪免费送大家的一个空间，支持PHP+MySql，免费二级域名，免费域名绑定 <a href="http://sae.sina.com.cn/activity/invite/80242/weibo">这个是我邀请的地址</a>，您通过这个链接注册即为我的好友，并获赠云豆500个，价值5元哦！短网址是<a href="http://t.cn/SXOiLh">http://t.cn/SXOiLh</a>我创建的小站每天访客已经达到2000+了，每天挂广告赚50+元哦，呵呵，饭钱不愁了，\(^o^)/</b>