zoukankan      html  css  js  c++  java

  • form表单详解

    表单属性   属性                          值                                           描述 accept                 MIME_type               规定通过文件上传来提交的文件的类型 accept-charset     charset                     服务器处理表单数据所接受的字符集 enctype                MIME_type              规定表单数据在发送到服务器之前应该如何编码 method                get/post                  规定表单数据发送的方式，get方法和post方法 name                   name                       规定表单的名称

    target                  _blank/_parent/_self/_top 规定在何处打开action URL

     

          1、action指定该表单发送时接受操作的地址       2、method指定表单数据发送的方法。可选值:get、post。get发送则表单内的数据将附加到url后发送。post则是在HTTP请求中发送。       3、enctype指定表单数据在发送的服务器之前如何编码，特别注意的是，当含有上传域时要设置编码方式为enctype="multipart/form-data"，否则后台无法获取到浏览器发送的文件数据。是设置表单的MIME编码。默认情况，这个编码格式是application/x-www-form-urlencoded，不能用于文件上传；只有使用了multipart/form-data，form里面的input的值以2进制的方式传过去。才能完整的传递文件数据。FTP上传大文件的时候，也有个选项是以二进制方式上传。

    enctype的三个选项

             值                                                            描述 application/x-www-form-urlencoded   在发送前编码所有字符（默认） multipart/form-data                            不对字符编码。以二进制的方式发送数据，当表单含有上传域时，必须使用后台才能获取上传的文件。 text/plain                                             空格转换为 "+" 加号，但不对特殊字符编码。

     

     

    属性值描述DTD
    accept mime_type 规定通过文件上传来提交的文件的类型。 STF
    align
    • left
    • right
    • top
    • middle
    • bottom
    		 不赞成使用。规定图像输入的对齐方式。 TF
    alt text 定义图像输入的替代文本。 STF
    checked checked 规定此 input 元素首次加载时应当被选中。 STF
    disabled disabled 当 input 元素加载时禁用此元素。 STF
    maxlength number 规定输入字段中的字符的最大长度。 STF
    name field_name 定义 input 元素的名称。 STF
    readonly readonly 规定输入字段为只读。 STF
    size number_of_char 定义输入字段的宽度。 STF
    src URL 定义以提交按钮形式显示的图像的 URL。 STF
    type
    • button
    • checkbox
    • file
    • hidden
    • image
    • password
    • radio
    • reset
    • submit
    • text
    		 规定 input 元素的类型。 STF
    value value 规定 input 元素的值。 STF

     

     

    HTML表单(Form)常用控件

     

    表单控件(Form Contros) 说明
    input type="text" 单行文本输入框
    input type="submit" 将表单(Form)里的信息提交给表单里action所指向的文件
    input type="checkbox" 复选框
    input type="radio" 单选框
    select 下拉框
    textArea 多行文本输入框
    input type="password" 密码输入框(输入的文字用*表示)

     

     

     

    [php] view plain copy
     print?
    1. <!doctype html>  
    2. <html>  
    3. <head>  
    4. <meta charset="utf-8">  
    5. <title>测试8</title>  
    6. </head>  
    7.   
    8. <body>  
    9. <form action="8.1.php" method="post"  enctype="multipart/form-data" target="_blank">  
    10. <table width="400" border="1" cellpadding="1" cellspacing="1" bgcolor="#999999" bordercolor="#FFFFFF">  
    11.  <tr bgcolor="#FFCC33">  
    12.   <td width="103" height="25" align="right">姓名</td>  
    13.   <!--文本框-->  
    14.   <td height="25" align="left"><input type="text" name="txtBox" value="textVal"></td>       
    15.  </tr>  
    16.  <tr  bgcolor="#FFCC33">  
    17.   <td width="103" height="25" align="right">密码</td>  
    18.   <!--密码框-->  
    19.   <td height="25" align="left"><input type="password" name="pswBox" value="psw"></td>       
    20.  </tr>  
    21.  <tr  bgcolor="#FFCC33">  
    22.   <td width="103" height="25" align="right">文本域</td>  
    23.   <!--文本域-->  
    24.   <td height="25" align="left">  
    25.    <fieldset>  
    26.      <legend>简介</legend>      
    27.      <textarea name="txtAreaA" cols="25" rows="5" wrap="off">我是一个兵，来自老百姓</textarea>     
    28.    </fieldset>  
    29.   </td>       
    30.  </tr>  
    31.  <tr  bgcolor="#FFCC33">  
    32.   <td width="103" height="25" align="right">性别</td>  
    33.   <td height="25" align="left">  
    34.    <!--单选按钮-->  
    35.    <label><input type="radio" name="radioSex" value="male">男人</input></label>  
    36.    <input type="radio" name="radioSex" value="female">女人</input>  
    37.   </td>       
    38.  </tr>  
    39.  <tr  bgcolor="#FFCC33">  
    40.   <td width="103" height="25" align="right">爱好</td>  
    41.   <td headers="25" align="left">  
    42.    <!--复选框-->  
    43.    <input type="checkbox" name="chkSport[]">篮球</input>  
    44.    <input type="checkbox" name="chkSport[]">足球</input>  
    45.   </td>  
    46.  </tr>  
    47.  <tr  bgcolor="#FFCC33">  
    48.   <td width="103" height="25" align="right">照片</td>  
    49.   <!--上传-->  
    50.   <td height="25" align="left"><input type="file" name="fileUpload" align="right" size="25"></td>       
    51.  </tr>  
    52.  <tr  bgcolor="#FFCC33">  
    53.   <td width="103" height="25" align="right">学历</td>  
    54.   <td height="25" align="left">  
    55.    <!--下拉列表-->  
    56.    <select name="selList" id="selList">  
    57.     <option value="0" selected="selected">专科</option>  
    58.     <option value="1">本科</option>  
    59.     <option value="2">研究生</option>  
    60.    </select>  
    61.   </td>       
    62.  </tr>  
    63.  <tr align="center"  bgcolor="#FFCC33">  
    64.   <td height="25" colspan="3">  
    65.    <!--重置按钮-->  
    66.    <input type="reset" name="resetBtn" value="重置">  
    67.    <!--提交按钮-->  
    68.    <input type="submit" name="submitBtn" value="提交">  
    69.   </td>       
    70.  </tr>  
    71. </table>  
    72.   
    73. <!--隐藏域在浏览器中并不显示，仅仅为保存一些不太重要的资料而存在-->  
    74. <input type="hidden" name="hiddenVal" value="不会显示的值"><br/>  
    75. <!--按钮-->  
    76. <input type="button" name="btn" value="确认"></input>  
    77.   
    78. </form>  
    79.   
    80.   
    81. <?php  
    82.     echo nl2br($_POST[txtAreaA]);     
    83. ?>  
    84.   
    85. </body>  
    86. </html>  
  • 相关阅读:
    Devexpress GridView添加行号
    Devexpress GridControl 常用设置
    导入Excel部分数据导入不了的原因及处理
    GridView里面的HyperLink和ButtonField操作总结
    sybase数据表的导出与导入
    uniapp的unistarter的白名单访问模式需要绝对路径
    vue 用vif隐藏显示切换大量dom元素，导致一个页面上一个组件多次调用的created不能全部执行的修改方法
    2013腾讯编程马拉松初赛：小Q系列故事——屌丝的逆袭
    Tensorflow Federated(TFF)框架整理（上）
    Stateful TFF
  • 原文地址：https://www.cnblogs.com/xiaobaizhang/p/7966079.html
Copyright © 2011-2022 走看看