form属性

  1. action:设置表单提交的地址
  2. method:设置表单提交的方式

可选值:

    • post:指的是http post方法,表单数据会在包含在表单体内然后发给服务器,用于提交敏感数据,如用户名和密码等
    • get:默认值,指的是http get方法,表单数据会附加在action属性的URL中,并用?作为分隔符,一般用于不敏感信息
  1. target:提交表单后在何处显示响应

可选值:

    • _blank:在新窗口响应
    • _self:在当前窗口响应
    • _parent:在父框架内响应
    • _top:在窗口的整个body中
    • framename:在命名的iframe中响应
  1. autocomplete:规定表单是否打开自动完成功能。启动自动完成功能后,浏览器会根据用户之前输入的值自动填写值
  2. novalidate:规定提交时不验证表单数据
  3. 补充属性
    • autocomplete=“off/on” 设置是否自动补全
    • readonly 设置为只读,不能修改
    • disabled 设置禁用
    • autofocus 自动获取焦点
    • placeholder 提示内容
    • checked 设置是否选中

表单元素

  1. input 输入标签

type=》设置标签类型

常用类型:

text(文本),password(密码),button(按钮),radio(单选按钮,name应该相同),checkbox(复选框),reset(重置按钮),submit(提交按钮)、file(上传文件)

新增属性:(老web不支持)

    • color:默认黑色,设置value值为完整的十六进制才有效
    • date:设置日期,可用value修改日期,格式2022-03-12
    • email:表单提交时,会判断所填的内容是否符合邮箱格式
    • url:表单提交时,会判断所填的内容是否是网址格式
    • number:可以设置输入数字的长短[min,max]
    • month、range、search、time、week
  1. select:下拉列表,option设置选项
  2. textarea:设置文本域,rows行,cols列
  3. button:可点击按钮

可设置

type:reset 重置

       submit 提交

       button 按钮

  1. label:input定义标签,提高鼠标用户的体验度,for属性值为相关元素的id,form属性值是form的id

eg:<input type=”radio” name=”sex” id=”sex”><label for=”sex”>男</label>

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐