表单

203 阅读3分钟

1.在 HTML 文档中,使用form标签来进行表单提交,form标签属于块元素有两个重要的属性:actionmethod属性,其中action的属性值是表单提交的地址即发送数据地址,method的属性值是提交的方法,其作用是将前端得数据发送给后端 (处理数据,存储数据,获取数据),进行存储处理获取数据等,之后通过js中ajax请求来完成,不建议使用form,因为会导致整个页面刷新。 2. method属性规定了表单提交方式,最常用的有两种方式,分别是 GET和 POST。请求是发送数据给对应(action)地址,其中 GET请求:发送的数据在地址栏显示?是对应的数据(不安全,一般是用于获取数据)是把表单中的参数放置在 HTTP请求的头部发送给服务器POST:检查的网络监听,表单数据中可以看到(稍微安全),将请求参数置于请求体内发送。 3.表单元素,form是表单的包含框,任何其他的表单域都必须包含在其中。包括三个属性 1enctype属性将设置表单中用户输入的数据发送到服务器时浏览器使用的编码类型application/x-www-form-urlencoded:将表单中的数据编码为名/值对的形式发送给服务器multipart/form-data:将表单中的数据编码为一条消息,每个表单域对应消息中的一个部分,然后发送到服务器*text/plain:将表单中的数据以纯文本的形式进行编码2 action属性用来设置表单提交数据的目标文件,可以是任意位置的和任何类型的文件3method属性表示处理表单数据的方法,get方法是从服务器上获取数据,而post是向服务器上传递数据; get方法将表单中的数据以“名/值”对的形式添加到action所设9置的url,post是将表单中的数据放在form的数据体中,按照变量和值所对应的方式传递到action,get方法传输的数据量小,而post可以传输大量的数据,一般在上传文件时只能使用post方法。 4.input标签属于行内块元素表示表单(用户输入框),其中它有不同的属性,用于表示不同的表单类型。

  • 文本类表单
  • 选择类表单
  • 文件上传类表单
  • 按钮表单

5.选项

  • button 按钮 用于激发提交表单动作,onclick属性配合JavaScript脚本对表单执行处理操作(onclick=“JavaScript函数名”)
  • file 创建文件域 enctype属性设置为multipart/form-data method值设为post multiple属性为设置上传多个文件
  • hidden创建隐藏域 用于在处理程序中获取域的数据
  • textarea创建文本域(块元素) name属性设置文本区域名称、rows属性设置行数、cols属性设置字符数(列)
  • number 创建数字输入框 min属性设置最小值 max属性设置最大值 step属性设置倍数
  • range 创建滑块
  • time 设置时间
  • date 创建年月日、month创建年月、week 创建年周
  • color 创建颜色