标签

释放双眼,带上耳机,听听看~!

上一篇简单的提到了<form>标签,这里就来详细的讲解这个标签的用法。

<form>标签属于表单标签,它的作用是用于收集用户信息,让用户输入、选择相关的信息提交到服务器进行处理,格式为<form> 所有的表单内容,都要写在form标签里面</form>,<form>标签有几个属性,分别是action、method、enctype和target属性,但就现目前大家的知识储备而言暂时无法理解, 但是还是要先说一下,有印象后才好慢慢理解消化。

action属性

通过<form>标签定义的表单里面必须有action属性才可以将表单中的数据递交上去。

<form action="some.php">
提交的内容……
</form>

以上代码表示这个表单的作用是用来提交some.php这个页面的数据。

method属性

该属性的作用是告诉浏览器数据是以何种方式提交上去的,该属性下有两个选择:"get"和"post",默认情况下,数据被提交的方 式是get,表单域中输入的内容会添加在action指定的URL中,当表单提交后用户便获得一个明确的URL,由于这种方式下数据会添 加到URL中,所以好处是可以保存在收藏夹中和他人分享,直接访问主页的URL可以达到和填写注册后一样的效果,如有些时 候,用户将自己已经注册过的一些网站主页加入到自己的收藏夹,再次从收藏夹中打开时,会发现已经是登录的状态。而post 这种方式,数据将以HTTP头的形式发送,表单数据不再是URL中的一部分。二者区别是get在安全性上较差,所有表单域的值 直接呈现,而post除了可见的处理脚本程序以外,别的东西都可以隐藏,所以在实际运用时通常选择post这种处理方式。

name属性

作用是令提交上去的表单数据可以被处理这些数据的程序识别,大部分页面中放入的表单很可能不止一个,此时就需要给不同 的表单起不同的名字,以便程序识别。

<form name="me">
</form>

...

<script>
      var length=document.me.length.value;
</script>

上述部分代码说明通过表单me获取输入的length数值,代码中有不同的表单可以通过name来识别,不了解JavaScript不要紧,看个大概再慢慢消化。

enctype属性

该属性代表HTML表单数据的编码方式,分别有application/x-www-form-urlencoded(标准编码方式,提交的数据被编码为名称/ 值对)、multipart/form-data(表示数据编码为一条信息,为表单定义了MIME编码方式,创建了一个与传统不同的POST缓冲 区,页面上每个控件对应消息的一个部分)和text/plain(表示数据以纯文本的形式进行编码,这样在信息中将不包含控件或格 式字符)共三种方式。

target属性

目标显示方式,表示在何处打开目标URL,可以设置4种方式,_blank表示在新的页面中打开链接,_self表示在相同的窗口打开 页面,_parent表示在父级窗口打开页面,_top表示将页面载入到包含该链接的窗口,取代任何当前在窗口中的页面。

<form action="https://www.zhanbaoku.com"
      method="post"
      name="me"
      enctype="text/plain"
      target="_blank">
...
</form>

这段代码表明该表单的动作是提交信息到https://www.zhanbaoku.com,使用post的传输方式,使用text/plain编码方式的me表单,使之 在新页面中打开。

总结:

<form>标签属于表单标签,它的作用是用于收集用户信息,让用户输入、选择相关的信息提交到服务器进行处理,格式为<form> 所有的表单内容,都要写在form标签里面</form>,<form>标签有几个属性,分别是action、method、enctype和target属性。

 

HTML

HTML表单

2019-11-12 16:39:12

HTML

input标签

2019-11-12 20:18:09

搜索