HTML之传递网页数据

最新推荐文章于 2021-08-06 10:45:55 发布

愤怒&高小一

最新推荐文章于 2021-08-06 10:45:55 发布

阅读量788

点赞数

分类专栏： HTML 文章标签： html

本文链接：https://blog.csdn.net/qq_45810848/article/details/107620610

版权

HTML 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

表单

在浏览网页时，我们可能会需要将一些数据输入到网页中。用户输入到网页中的信息均通过表单中的各个表单元素来接收，然后传递给服务器。表单在网页开发中是非常常见的，常见于网站的登录、注册呀什么的。

概述

在一个表单中，由各个表单元素来决定自生项其起着何作用。常见的表单元素类型有这么几种：

文本框：常用于输入姓名、用户名和电子邮件等。
密码框：用于输入密码，页面显示则为星号（*）。
单选按钮：在多个选择中选择一个。
复选框：在多个选择中可以选择一至多个。
下拉列表：在多个下拉选项中选择一个。
按钮：通常用于执行表单信息的递交或者是取消等功能。

在HTML中我们使用<form>标签来创建表单。在表单下可建立各个表单元素项。因为一个表单可以向Web服务器传递多个信息，所以为了分辨这些信息，我们可以为表单和各个表单元素项设置一个名称标识。这样服务器就可以根据各个名称标识来获取各项信息。

创建表单的语法如下：

<form name="表单名称" action="URL" method="get/post">

这里的action属性用于设置处理表单提交数据的URL。一般为后台网址。method属性用于定义浏览器将表单数据提交给服务器的方式。这里推荐使用post，因为其安全性更高。

表单元素

除了下拉列表框，多行文本域等少数表单元素外。大部分表单元素都可以用<input>标签来创建。

<input name="" type="" value="" size="" maxlength="" checked="" readonly="">

1，type

type属性用于指定表单元素的类型，可以选用的选项一般有text、password、radio、checkbox、file、submit、reset和button。默认为text。有些读字意都是好理解的，这里着重看看不好理解的：

（1）radio：单选按钮

单选按钮用于一组相互排斥的选项，组中的每一个选项需要具备同一个名称（即name属性），以确保用户只能选择一个选项。

（2）checkbox：复选框

复选框用于选择多个选项，一个复选框下的各个表单元素也需具有相同的name属性。

（3）file：文件域

文件域用于上传文件，可上传图片呀什么的。

（4）submit、reset、button：提交、重置与普通按钮

根据按钮的功能大致可分为三类：递交按钮用于提交表单数据、重置按钮用于清空现有的表单数据、普通按钮则用于调用一些脚本什么的。当我们想禁用某按钮时，我们可以使用附加的disabled属性。

2，value

value属性用于指定表单的初始值，使用时一般和其它按钮结合。

3，size

size属性用于指定表单元素的初始宽度。如果需输入的是值，则大小以字符为单位；其它输入类型，则以像素为单位。

4，maxlength

maxlength属性用于指定可在text或password元素中输入的最大字符串，默认为无限制。

5，checked

此属性只有一个值（和disabled类似），即checked。设置后即表示为选中状态，一般和按钮一起搭配使用。

——下拉列表

下拉列表主要可以使用户快速、方便、正确地选择一些选项，而且还能节省页面空间。通过<select>标签可以用来创建下拉列表，通过<option>标签可以设立各个列表选项。

<select name="列表名称" size="函数">
    <option value="可选择的值" selected="selected">显示内容1</option>
    <option value="可选择的值">显示内容2</option>
    <option value="可选择的值">显示内容3</option>
</select>

这里的“size”属性用于确定列表中可以同时看到的行数；“value”属性中的值即用来传入后台的数据；“selected”属性表示该选项在默认情况下是被选中的。

——多行文本域

多行文本域用于显示或输入两行或两行以上的文本，用<textarea>标签来创建此域。

<textarea name="" cols="列数" rows="行数">
	请输入自我介绍的内容...
</textarea>

Summary

<body>
    <p ><font size="6">青年志愿者服务队纳新申请表</font></p><hr align="left" width="50%"/>
    <form name="base-information" action="Weclome.html" method="post">
        <strong>姓名：</strong><input type="text" name="username" size="12"/>&nbsp;&nbsp;&nbsp;
        <strong>姓别：</strong><input type="radio" name="sex" value="male"/>男
        <input type="radio" name="sex" value="female"/>女<br/><br/>
        <strong>出生年月：</strong><input type="text" name="birth" size="12"/>&nbsp;&nbsp;&nbsp;
        <strong>政治面貌：</strong><input type="text" name="ps" size="6"/><br/><br/>
        <strong>生源地：</strong>
        <select name="born">
            <option value="-1" selected="selected">选择地区</option>
        </select><br/><br/>
        <textarea name="self" rows="10" cols="50">自我介绍...</textarea><br/><br/>
        <strong>附加信息：</strong><input type="file" name="extern"/><br/><br/>
        <input type="submit" value="提交"/>
        <input type="reset" value="重置"/>
    </form>
</body>

material.1

原文链接：http://adolesce.cn/archives/29.html

愤怒&高小一

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML之传递网页数据

表单在浏览网页时，我们可能会需要将一些数据输入到网页中。用户输入到网页中的信息均通过表单中的各个表单元素来接收，然后传递给服务器。表单在网页开发中是非常常见的，常见于网站的登录、注册呀什么的。概述在一个表单中，由各个表单元素来决定自生项其起着何作用。常见的表单元素类型有这么几种：文本框：常用于输入姓名、用户名和电子邮件等。密码框：用于输入密码，页面显示则为星号（*）。单选按钮：在多个选择中选择一个。复选框：在多个选择中可以选择一至多个。下拉列表：在多个下拉选项中选择一个。按钮：通常用于执
复制链接

扫一扫