• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    关于html的表单元素详解(一)

    HTML 表单用于搜集不同类型的用户输入

    HTML 表单用于收集用户输入;

    form 元素定义 HTML 表单。

    <form>
        form elements
    </form>

    Action 属性

    action 属性定义在提交表单时执行的动作。

    向服务器提交表单的通常做法是使用提交按钮。

     通常,表单会被提交到 web 服务器上的网页。

     如果省略 action 属性,则 action 会被设置为当前页面

    Method 属性

    method 属性规定在提交表单时所用的 HTTP 方法(GET 或 POST):

    何时使用 GET?

    您能够使用 GET(默认方法):

    如果表单提交是被动的(比如搜索引擎查询),并且没有敏感信息。
    当您使用 GET 时,表单数据在页面地址栏中是可见的:action.jsp?name=xxxx&sex=female
    *ps:GET 最适合少量数据的提交。浏览器会设定容量限制。

    何时使用 POST?

    您应该使用 POST:

    如果表单正在更新数据,或者包含敏感信息(例如密码)。
    POST 的安全性更加,因为在页面地址栏中被提交的数据是不可见的。

    HTML 表单包含表单元素

    表单元素指的是不同类型的 input 元素、复选框、单选按钮、提交按钮、文本域等

    <input> 元素

    <input> 元素是最重要的表单元素。

    <input> 元素有很多形态,根据不同的 type 属性。

    -文本输入:type=”text”

    <form>
    <label>用户名</label>
    <input type="text" name="">
    </form>

    -提交按钮:type=”submit”(定义提交表单数据至表单处理程序的按钮)

    <form action="action.jsp">
    <input type="submit" value="提交">
    </form>
    /*和action配合*/
    /*如果省略了提交按钮的 value 属性,那么该按钮将获得默认文本,也就是提交两个字*/

    -单选:type=”radio”

    <form>
    <label>性别</label>
    <input type="radio" name="sex" value="male" checked>Male
    <br>
    <input type="radio" name="sex" value="female">Female
    </form> 
    /*name中的值一致时,可以达到单选的效果*/
    /*checked 是被选中状态 也可以写成checked="checked"*/

    -复选:type=”checkbox”

    <form>
    <label>爱好</label>
    <input type="checkbox" name="vehicle" value="运动"><label>运动</label>
    <br>
    <input type="checkbox" name="vehicle" value="美女"> <label>美女</label>
    </form>
    
    /*checked 是被选中状态 也可以写成checked="checked"*/
    

    -定义按钮:type=”button”

    <form>
    <input type="button" onclick="alert('欢迎来到脚本之家!')" value="点我!">
    </form> 
    
    /*也是普通按钮*/
    

    -下拉列表:< select > 元素
     

    <form>
    <select name="cars">
        <option value="volvo">Volvo</option>
        <option value="saab">Saab</option>
        <option value="fiat">Fiat</option>
        <option value="audi">Audi</option>
    </select>
    </form> 
    
    <option> 元素定义待选择的选项。
    列表通常会把首个选项显示为被选选项。
    您能够通过添加 selected 属性来定义预定义选项。
    

    -文本域:< textarea> 元素(定义多行输入字段)

    <form>
    <textarea name="message" rows="10" cols="30">
    输入的内容在这里哦!
    </textarea>
    

    -按钮:< button> 元素

    <form>
    <button type="button" onclick="alert('欢迎来到脚本之家!')">点击!</button>

    想要更加了解表单元素其中的属性,请点击链接:https://www.jb51.net/web/571879.html 

    以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助~如果有疑问大家可以留言交流,谢谢大家对脚本之家的支持!

     

    上一篇:网页加载进度条详解(推荐)
    下一篇:关于html的表单元素详解(二)
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯 版权所有

    《增值电信业务经营许可证》 苏ICP备15040257号-8

    关于html的表单元素详解(一) 关于,html,的,表单,元素,