zoukankan      html  css  js  c++  java
  • 了解html表单

    html表单

    表单的根标签:form

    form标签属性

    action:处理表单业务的后台代码的位置(URL)

    method:提交方式

    post

    get  默认值

    enctype:encode type编码类型

    admin 字符数据 不能直接在网络之间进行传输

    所以需要先将字符数据编码成二进制数据

    常用的可选值:

    application/x-www-form-urlencoded 默认值

    multipart/form-data 当需要上传文件时,必须使用这个编码方式

    注意:表单里面的数据想要提交到服务器,必须提供一个name属性

    post提交与get提交的区别:

    1、如果是get提交,表单数据会被拼接到地址栏的url后面;而post提交的话不会直接在地址栏显示。

    2、post提交相对于get提交,安全性更高。

    3、get提交一次可提交的数据不能超过1KB;而post提交时一次可提交的数据没有限制。所以在需要上传文件时,肯定是使用post提交。

    常见的表单控件有哪些?

    文本框 input:text

    密码框 input:password

    按钮 使用<button>标签或者input:button生成按钮

    <button> 标签定义一个按钮,在 button 元素内部,可以放置内容,比如文本或图像。这是该元素与使用 input 元素创建的按钮之间的不同之处。

    按钮分类:提交按钮、重置按钮、普通按钮

    单选按钮 input:radio  一组单选按钮的name属性必须保持一致

    复选框 input:checkbox

    下拉列表 select

    文本域 textarea

    文件上传 input:file

    隐藏域 input:hidden

    当需要提交某个数据到服务器,但是又不希望被用户看到,就可以使用隐藏域。

    <input type="hidden" name="pid" value="1011">

    表单其它标签

    <label></label>  //定义input元素的标注
    <fieldset></fieldset>  //定义围绕表单中元素的边框
    <legend></legend>  //fieldset的标题

    表单控件的属性

    autofocus:自动获取焦点

     readonly:只读  不能修改控件的内容

    placeholder:表单控件的提示信息  跟value完全不一样

    value:表单控件的值

    disabled:禁用

    required:必填

    checked:只能用于单选按钮或者复选框的默认选中

    selected:只能用于下拉列表的默认选中

    readonly和disabled的区别:

    1、被禁用的表单控件背景色是灰色的;但是只读的表单控件背景色是白色的。

    2、被禁用的表单控件数据不会被提交,但是只读可以提交。

  • 相关阅读:
    Vuex 在state中存取数据 modules分模块 (2018/11/28)
    计数器(2018/11/29)
    03$router和$route的区别 (2018/11/28)
    02导航守卫 (2018/11/28)
    01模拟用户的登录 (2018/11/27)
    路由传参(2018/11/26)
    CSS制作红桃心
    css制作三角形
    css内容超出显示省略号
    css制作旋转风车(transform 篇)
  • 原文地址:https://www.cnblogs.com/crazier/p/11568074.html
Copyright © 2011-2022 走看看