HTML中的表单

柔情只为你懂 2024-04-06 13:09 51阅读 0赞

**目录**

1、表单的作用

2、定义表单的语法

3、file控件

4、hidden控件

5、readonly和disabled

6、maxlength属性

--------------------

### 1、表单的作用 ###

用来向服务器发送用户输入的信息

### 2、定义表单的语法 ###

<form  action="提交地址"    method="get/post">
    
                                            
            用户名：<input  type="text"       name="username" />    
                                
            密码：<input type="password"  name="password" / >                                  
    
            性别：<input type="radio"   name="sex"    value="m"   checked/ > 男      
                  <input type="radio"   name="sex"    value="w"   / >  女    
    
                                                            <！--checked表示默认选中-->
    
            爱好：<input type="checkbox"  name="hobby"  value="smoke" / >抽烟    
               <input type="checkbox"  name="hobby"  value="drink"/ >喝酒
               <input typt="checkbox"   name="hobby"  value="firehair" / >烫头
    
            学历：<select name="xueli"    multiple  (多选)    size="显示的条数" >   
                       
                     <option value="gz">高中</option>
                     <option value="dz">大专</option>   
                     <option value="bk"  selected>本科</option>    
                     <option vaule="ss">硕士</option>
                 </select>
       
    
    简介：<textarea  name="jianjie"  rows="行数"  cols="列数"></textarea>  
    
    
                   <input  type="submit"  value="提交" />     
                  
    
                   <input type="reset"  value="重置">             
    
    </form>

notes（注释）:

一个网页上可以存在多个表单

按钮必须在表单内才能提交

**表单中只有有name属性的才能提交**

**数据提交的格式：属性=属性值&属性=属性值**

表单中没有填写的默认提交空字符串

### 3、file控件 ###

<input  type="file" />

作用：用来上传文件

### 4、hidden控件 ###

<input type="hidden"   name="coder"  value="天下第一">

作用：用来隐藏数据

### 5、readonly和disabled ###

<input  type="text"  readonly   value="1111" / >
    
    <input type="text"  disabled    value="2222"/>

效果如下：

![30030cc365744b7aa381ccf7db6ecc14.png][]

notes：

两者都是只读

readonly能提交给服务器

disabled不能提交给服务器

### 6、maxlength属性 ###

作用：用来制定输入的最大长度

<input  type="text"  maxlength="3" / >

[30030cc365744b7aa381ccf7db6ecc14.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/06/131319c9d94b4a768cc725bd3a40d961.png

发表评论取消回复

表情：

评论列表（有 0 条评论，51人围观）

还没有评论，来说两句吧...

相关阅读

相关 [HTML三] html表单

八、表单标签 8.1 表单的介绍 > 表单用于搜集不同类型的用户输入(用户输入的数据)，然后可以把用户数据提交到web服务器。 8.2 表单相关标签的使用

朱雀/ 2023年03月06日 05:49/ 0 赞/ 239 阅读

相关 html表单中提示错误,在HTML表单的HTML DOM脚本中获取错误“意外的标记”

我正在开发一个带有phonegap的android应用程序。我试图在其中一个页面中使用HTML表单，并且我被告知应该使用HTML DOM。我已经创建了该脚本，但是我收到了一个错

叁歲伎倆/ 2022年10月10日 11:24/ 0 赞/ 147 阅读

相关 HTML中的表单元素

直接给个例子吧，这样比较直观： <form action="http://www.baidu.com" method="get"> 单行文本框：<in

快来打我*/ 2022年08月23日 03:44/ 0 赞/ 195 阅读

相关 html表单

表单 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

灰太狼/ 2022年08月20日 06:22/ 0 赞/ 217 阅读

相关 HTML5中的表单验证

1.使用占位符placeholder。但是这个在chrome不是很好用。使用过bootstrap框架的人肯定都很了解 <input type="text" place

Love The Way You Lie/ 2022年06月13日 07:26/ 0 赞/ 185 阅读

相关 HTML表单

表单元素本身是指`<form>`，不过它也有一个更广泛的概念，指构成表单的所有元素。首先就`<form>`元素本身来说，主要有两个属性（暂时不用细究，到后面我们还有详细说明

Dear 丶/ 2022年05月27日 09:42/ 0 赞/ 270 阅读

相关 HTML表单

HTML表单(form) 表单作用：与用户交互，把用户输入的数据传送到服务器端，然后服务器端程序验证。表单包含内容：表单控件提示信息表单域 fo

清疚/ 2022年05月17日 00:51/ 0 赞/ 248 阅读

相关 HTML
表单中的label标签

　　label标签不会向用户呈现任何特殊效果，它的作用是为鼠标用户改进了可用性。如果你在 label 标签内点击文本，就会触发此控件。就是说，当用户单击选中该label标签时，

不念不忘少年蓝@/ 2021年12月15日 08:53/ 0 赞/ 324 阅读

相关 html表单

表单标签 form表单:所有希望提交给服务器的数据都必须放在form表单里面表单提交: 1.可以通过按钮提交 2.通过js提交 3.通过图片提交 a

朱雀/ 2021年11月17日 03:32/ 0 赞/ 430 阅读

相关 HTML中Form表单的使用

1、form表单标记表单标记以<form>标记开头，以</form>标记结尾。在表单标记中可以定义处理表单数据程序的URL地址等信息。 <form>标记的基本语法如下

妖狐艹你老母/ 2021年09月20日 07:46/ 0 赞/ 441 阅读