博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
html5--3.17 新增的表单重写
阅读量:4657 次
发布时间:2019-06-09

本文共 2058 字,大约阅读时间需要 6 分钟。

html5--3.17 新增的表单重写

学习要点

  • 对form元素的属性做一个小结,对个别属性进行一点补充
  • 重点掌握新增的表单重写

form元素的属性小结

    • action/method/enctype/name/accept-charset/accept/target/autocomplete/novalidate

    • accept属性:(仅作了解)指定服务器处理表单时所能接受的数据形态,一般默认即可

    • accept-charset: (仅作了解)指定表单处理数据时所能接受的字符编码

    • target属性:指定在何处打开action属性所指定的URL目标

    • enctype属性:(了解即可)规定在发送到服务器之前应该如何对表单数据进行编码

      • 当method设定发送方式为get时,不必设置该属性;

 

      • method设定发送方式为post该属性才有效

 

      • 默认地,表单数据会编码为 "application/x-www-form-urlencoded"。就是说,在发送到服务器之前,所有字符都会进行编码(空格转换为 "+" 加号,特殊符号转换为 ASCII HEX 值)。

 

      • 当值设为"multipart/form-data"时表示:不对字符编码。在使用包含文件上传控件的表单时(比如当input的type值为file时),必须使用该值

 

      • text/plain:空格转换为 "+" 加号,但不对特殊字符编码

 

    • 表单的重写:重写 form 元素的某些属性设定。

表单重写属性适用于提交按钮(input的button和直接的button都可以)

    • formaction - 重写表单的 action 属性
    • formenctype - 重写表单的 enctype 属性
    • formmethod - 重写表单的 method 属性
    • formnovalidate - 重写表单的 novalidate 属性
    • formtarget - 重写表单的 target 属性

button元素

    • 用来建立一个按钮从功能上来说,与input元素建立的按钮相同

 

    • button元素是双标签,其内部可以配置图片与文字,进行更复杂的样式设计
    • 不仅可以在表单中使用,还可以在其他块元素和内联元素中使用

 

  • button元素的属性
    • type属性:可以设置三个值 submit/reset/button与input元素设置的按钮含义相同
    • name/vlue/disable属性:与input的用法相同
    • autofocus属性:设置按钮自动获得焦点。
    • form属性:设定按钮隶属于哪一个或多个表单
    • formmethod属性:设定表单的提交方式,将覆盖原本的提交方式
    • formnovalidate属性:设定表单将会覆盖原本的novalidate属性
    • fomaction属性:指定表单数据发送对象,将覆盖原来的action属性设定
    • formenctype属性;指定表单的数据发送类型,将覆盖原本的enctype属性设定
    • formtarget属性:将覆盖原本的target属性设定

重要事项:如果在表单中使用 button 元素,不同的浏览器会提交不同的值。Internet Explorer 将提交 button元素开始标签与结束标签之间的文本,而其他浏览器将提交 value 属性的内容。最好就是在表单中使用 input 元素来创建按钮。其他地方使用button创建按钮

 

实例

 

 

1  2  3  4 
5 无标题文档 6 7

8 9

10
11 用户名:
12 意见:
13

表单重写属性适用于提交按钮

14

15 formaction - 重写表单的 action 属性

16 formenctype - 重写表单的 enctype 属性
17 formmethod - 重写表单的 method 属性
18 formnovalidate - 重写表单的 novalidate 属性
19 formtarget - 重写表单的 target 属性
20

21
22
23
24
28 29
30 31 32
View Code

 

转载于:https://www.cnblogs.com/Renyi-Fan/p/7968155.html

你可能感兴趣的文章
oracle, group by, having, where
查看>>
nodejs pm2使用
查看>>
CSS选择器总结
查看>>
mysql中sql语句
查看>>
sql语句的各种模糊查询语句
查看>>
C#操作OFFICE一(EXCEL)
查看>>
【js操作url参数】获取指定url参数值、取指定url参数并转为json对象
查看>>
移动端单屏解决方案
查看>>
web渗透测试基本步骤
查看>>
使用Struts2标签遍历集合
查看>>
angular.isUndefined()
查看>>
第一次软件工程作业(改进版)
查看>>
网络流24题-飞行员配对方案问题
查看>>
引入css的四种方式
查看>>
iOS开发UI篇—transframe属性(形变)
查看>>
3月7日 ArrayList集合
查看>>
jsp 环境配置记录
查看>>
Python03
查看>>
LOJ 2537 「PKUWC2018」Minimax
查看>>
使用java中replaceAll方法替换字符串中的反斜杠
查看>>