github.com/qiuhoude/go-web@v0.0.0-20220223060959-ab545e78f20d/prepare/03_form/register.html (about)

     1  <!DOCTYPE html>
     2  <html lang="en">
     3  <head>
     4      <meta charset="UTF-8">
     5      <title>验证表单</title>
     6  </head>
     7  <body>
     8  <h1>注册信息</h1>
     9  
    10  <form action="http://localhost:8000/register" method="post">
    11      用户名：
    12      <input type="text" name="username" id="username">
    13      <br/>
    14      密&nbsp&nbsp&nbsp码：
    15      <input type="password" name="pwd" id="pwd"/>
    16      <br/>
    17      中文名：
    18      <input type="text" name="zhname" id="zhname"/>
    19      <br/>
    20      英文名：
    21      <input type="text" name="enname" id="enname"/>
    22      <br/>
    23      年&nbsp&nbsp&nbsp龄：
    24      <input type="number" name="age" id="age"/>
    25      性&nbsp&nbsp&nbsp&nbsp别：
    26      <input type="radio" name="sex" value="male" checked="checked"/>男
    27      <input type="radio" name="sex" value="female"/>女
    28      <input type="radio" name="sex" value="other"/>其他
    29      <br/>
    30      邮&nbsp&nbsp&nbsp箱：
    31      <input type="email" name="email" id="email"/>
    32      <br/>
    33      手机号码：
    34      <input type="text" name="mobile" id="mobile" />
    35      <br />
    36      身份证号：
    37      <input type="text" name="usercard" id="usercard">
    38      <br>
    39      爱&nbsp&nbsp&nbsp好：
    40      <input type="checkbox" name="hobby" value="game" checked="checked"/>游戏
    41      <input type="checkbox" name="hobby" value="girl" />女人
    42      <input type="checkbox" name="hobby" value="money" />金钱
    43      <input type="checkbox" name="hobby" value="power" />权利
    44      <br />
    45      学&nbsp&nbsp&nbsp历：
    46      <!--
    47          selected="selected"
    48      -->
    49      <select name="xueli">
    50          <option>--请选择--</option>
    51          <option value="xiaoxue">小学</option>
    52          <option value="chuzhong">初中</option>
    53          <option value="gaozhong">高中</option>
    54          <option value="dazhuan" >大专</option>
    55          <option value="benke">本科</option>
    56          <option value="shuoshi">硕士</option>
    57          <option value="boshi">博士</option>
    58          <option value="lieshi">烈士</option>
    59      </select>
    60      <br />
    61      头&nbsp&nbsp&nbsp像：
    62      <input type="file" name="myfile" />
    63      <br />
    64      个人简介：
    65      <br />
    66      <textarea rows="8" cols="70"></textarea>
    67      <br />
    68      <!--
    69          按钮：带事件，不带事件
    70              事件：发生了某一件事
    71              带事件：按钮被点击，会触发某一件事
    72              不带事件：按钮被点击，页面没有反应。配合JavaScript
    73  
    74          button:无事件
    75          image：无事件
    76          reset：有事件，清空表单数据
    77          submit：有事件，提交表单
    78              当submit按钮被点击，触发form表单中action属性的路径(服务器地址)
    79  
    80          提交方式：
    81          get：默认
    82              词意：获取，获得
    83              url？username=zhangsan&pwd=123456&sex=female..
    84              url：请求的路径地址
    85              ？
    86                  前是请求路径
    87                   后本次请求提交的数据
    88                  传递的数据：采用名值对的形式
    89                  参数名=参数值&参数名=参数值。。。
    90  
    91              不安全：数据暴露了
    92              传递少量的数据
    93              容易乱码
    94  
    95          post：
    96              词意：邮政邮局
    97              数据打包之后，传递给服务端
    98              数据安全
    99              可以传递大量的数据
   100              不容易乱码
   101  
   102      -->
   103      <input type="button" value="按钮" />
   104      <input type="reset" value="重置"/>
   105      <input type="image" src="img/qq.gif" />
   106      <input type="submit" value="提交" />
   107  </form>
   108  </body>
   109  </html>