zoukankan      html  css  js  c++  java
  • form表单总结

    • 按钮类:
          <form action="#" method="get"><!--action为提交地址,method为提交方式,get显式,post隐式-->
              <input type="submit" value="提交" name="submit" /> <!--提交按钮,点击时提交相应数据-->
              <input type="button" value="按钮" name="button"/>  <!--普通按钮,单独使用时点击无任何效果-->
              <input type="image" src="item_1.png" name="image"/><!--图片按钮,作用与提交按钮相同--> 
              <input type="reset" value="重置" name="reset" />   <!--重置按钮,点击重置输入的内容-->
          </form>
    • 文本类:
          <form action="#" method="get">
          
              <input type="text" value="在此输入" name="text" />  <!--单行文本输入,多用于用户名输入-->
              <input type="password" value="   " name="password" /><!--密码输入,输入内容不可见-->
              <input type="hidden" value="yincang" name="hidden" /><!--隐藏域,在网页上并不显示-->
              <textarea rows="5" name="textarea">请输入你想说的话</textarea><!--文本域输入,rows规定行数-->
              
          </form>
    • 选择类:
      • 单选:
            <form action="#" method="get"><input type="radio" value="male" name="sex" checked="checked" /><input type="radio" value="female" name="sex" />        
            </form>
                <!--同组单选按钮必须name值相同,checked为默认选项-->
      • 复选:

            <form action="#" method="get">
                苹果<input type="checkbox" value="apple" name="fruit" checked="checked" />
                香蕉<input type="checkbox" value="banana" name="fruit" />
                桔子<input type="checkbox" value="orange" name="fruit" />    
            </form>
                <!--同组按钮name值相同,checked为默认选项-->
      • 下拉列表:

            <form action="#" method="get">
                <select name="province" multiple="multiple"><!--双标签元素,用multiple变为多选-->
                    <option value="shandong" selected="selected">山东省</option><!--selected为默认选项-->
                    <option value="henan">河南省</option>
                    <option value="jiangsu">江苏省</option>
                    <option value="shanxi">陕西省</option>
                </select>
            </form>
      • 选择文件类:

                <input type="file" name="update" value="1" /><!--多用于上传文件-->
          
  • 相关阅读:
    【CodeVS 3290】【NOIP 2013】华容道
    【UOJ #20】【NOIP 2014】解方程
    【UOJ #17】【NOIP 2014】飞扬的小鸟
    【UOJ #147】【NOIP 2015】斗地主
    【UOJ #150】【NOIP 2015】运输计划
    【POJ 3241】Object Clustering 曼哈顿距离最小生成树
    【COGS 254】【POI 2001】交通网络图
    【CodeVS 2083】Cryptcowgraphy 解密牛语
    1654 方程的解
    2124: 等差子序列
  • 原文地址:https://www.cnblogs.com/rose1324/p/7885922.html
Copyright © 2011-2022 走看看