zoukankan      html  css  js  c++  java
  • html的表单元素

    html的表单元素主要用于让用户输入数据,并提交给服务器。

    基本语法是:

    <form action="url" method="提价的方法(get/post)">

    各种元素[输入框,下拉列表,密码框,文本域]

    </form>

    默认用的是get方法。

    案例:

    <html>
    <head>
    <title>登录界面</title>
    </head>
    <body>
    <h1>登录界面</h1>
    <form action="???" method="get">
    用户名:<input type="text" name="username"><br/>
    密&nbsp; &nbsp码:<input type="password" name="pwd"><br/>
    <input type="submit" value="登录">
    <input type="reset" value="重新填写"/>
    </form>
    </body>
    </html>

    form里中的type可以是text,password,checkBox,radio,image,hidden,submit,reset.

    可以用&nbsp表示一个空格,全角空格可以在html中占用一个汉字的位置大小。

    从上面的案例,我们可以看出:

    (1)表单元素的格式

    <input type=* name=**/>

    type=text(文本框)   password(密码框)  hidden(隐藏域)  checkbox(复选框)   radio(单选框)

    submit(提交按钮)  reset(重置按钮) image(图片按钮)

    name 是你给该表单元素取名。

    (2)action指定把请求交给哪个页面

    input元素的举例说明

    代码:

    名字:<input type="text" name="username" value="请填入名字..."/><br/>
    密码:<input type="password" name="pwd" value="00"/><br/>
    
    ***喜欢的水果***<br/>
    <input type="checkbox" name="v1">西瓜<br/>
    <input type="checkbox" name="v2">苹果<br/>
    <!--name最好一致,这样才能保证是同一个复选框,name不一样不会被选中吧-->
    
    ***********选择性别********<br/>
    <input type="radio" name="sex"/><br/>
    <input type="radio" name="sex"/><br/>
    <!--参与单选的name一定要一样,否则无法达到切换的目的-->
    ************隐藏(它的用处主要是,既可以提交数据,同时不影响界面,不占用空间)<br/>
    <input type="hidden" value="123" name="sal"/>
    与上面文字间没有空隙。<br/>
    在div+css中不占用位置,可以加入。
    *************下拉选择框********<br/>
    请选择你的出生地
    <select name="birAddress">
    <!--将数据提交给服务器时,服务器接收到的是value值-->
    <option value="">----请选择-----</option><!--可以扩展宽度-->
    <option value="beijing">北京</option>
    <option value="chongqi ">重庆</option>
    <option value="sh">上海</option>
    </select>
    
    ************请留言********<br/>
    <textarea cols="30" rows="10">请这里输入......</textarea><br/>
    **********请选择你要上传的文件*******<br/>
    <input type="file" name="myfile"/>请选择文件
  • 相关阅读:
    玲珑oj 1129 ST
    HDU 3397 线段树区间修改
    bzoj 1798 双标记区间修改线段树
    HDU 4417 BIT or ST
    HDU 2492 BIT/逆序数/排列组合
    uva 12086 线段树or树状数组练习
    cf 833 A 数论
    wcf的DataContractAttribute与DataMenmberAttribute
    wcf服务查看工具
    git学习-综合性文章
  • 原文地址:https://www.cnblogs.com/liaoxiaolao/p/9720161.html
Copyright © 2011-2022 走看看