前端 HTML form表单标签 input标签 type属性 checkbox 多选框
多选框
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title</title>
</head>
<body>
<form action="http://www.baidu.com" method="get">
<div>
<!-- 复选框 -->
<p>
用户爱好:
羽毛球<input type="checkbox" value="1">
篮球<input type="checkbox" value="2">
足球<input type="checkbox" value="3">
读书<input type="checkbox" value="4">
</p> </div>
<input type="submit" value="提交">
</form>
</body>
</html>
name属性设置为一样，这样后台就知道用户选中了几个
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title</title>
</head>
<body>
<form action="http://www.baidu.com" method="get">
<div>
<!-- 复选框 -->
<p>
用户爱好:
羽毛球<input type="checkbox" name="favor" value="1">
篮球<input type="checkbox" name="favor" value="2">
足球<input type="checkbox" name="favor" value="3">
读书<input type="checkbox" name="favor" value="4">
</p> </div>
<input type="submit" value="提交">
</form>
</body>
</html>
url上传递name属性相同
加上checked 让这个选项默认被选中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title</title>
</head>
<body>
<form action="http://www.baidu.com" method="get">
<div>
<!-- 复选框 -->
<p>
用户爱好:
羽毛球<input type="checkbox" name="favor" value="1" checked>
篮球<input type="checkbox" name="favor" value="2">
足球<input type="checkbox" name="favor" value="3">
读书<input type="checkbox" name="favor" value="4">
</p> </div>
<input type="submit" value="提交">
</form>
</body>
</html>
前端 HTML form表单标签 input标签 type属性 checkbox 多选框的更多相关文章
- 常用6种type的form表单的input标签分析及示例
<input> 标签用于搜集用户信息. 根据不同的 type 属性值,输入字段拥有很多种形式.输入字段可以是文本字段.复选框.掩码后的文本控件.单选按钮.按钮等等. 在这里博主介绍6中ty ...
- ajax form表单提交 input file中的文件
ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...
- 前端 HTML form表单标签 input标签 type属性 file 上传文件
加上上传文件功能 input type='file' - 依赖form表单里一个属性 enctype="multipart/form-data" 加上这个属性表示把你上次文件一点 ...
- php 处理 form 表单提交多个 name 属性值相同的 input 标签
一 问题 在公司的开发过程中,遇到了一个问题:如何处理 form 表单提交了多个 name 属性值相同的 input 标签?源码如下(源码是在 form 表单之中的): <!--{loop $a ...
- input file 在开发中遇到的问题 类似ajax form表单提交 input file中的文件
最近在做项目的过程中遇到个问题,在这里做个记录防止日后忘记 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为 ...
- 前端之form表单与css（1）
目录 一.form表单 1.1表单的属性 1.2input 1.2.1form表单提交数据的两种方式 1.3select标签 1.4label标签 1.5textarea多行文本标签 二.CSS 2. ...
- 判断form表单每个input字段是否有内容
//---------------------------------------------------input失去焦点时判断是否有值 btn_click: function () { //inp ...
- 前端通过form表单构造带参数url
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- 前端 HTML form表单标签 select标签 option 下拉框
<select></select> select里面通常跟option配合使用 <!DOCTYPE html> <html lang="en&quo ...
随机推荐
- ［转］如何通过 App Store 审核（iOS 开发者经验分享）
CocoaChina交流社区曾经发起一个主题讨论,关于iOS开发者遇到审核失败的原因及解决办法的,有价值的回复内容如下: wubo9935 App中设计的图标与Apple原生图标类似,Apple原生图 ...
- [Python] 03 - Lists, Dictionaries, Tuples, Set
Lists 列表 一.基础知识 定义 >>> sList = list("hello") >>> sList ['h', 'e', 'l', ' ...
- 【代码审计】大米CMS_V5.5.3 后台多处存储型XSS漏洞分析
0x00 环境准备 大米CMS官网:http://www.damicms.com 网站源码版本:大米CMS_V5.5.3试用版(更新时间:2017-04-15) 程序源码下载:http://www ...
- PullToRefreshListView 应用讲解
转载于http://blog.csdn.net/mmjiajia132/article/details/40397813 PullToRefreshListView 用法和ListView 没有什么区 ...
- TSPL学习笔记(2):过程和变量绑定
变量的引用 语法: variable 返回: variable的值 如果在某个范围内存在对某个标识符的变量绑定,那么当这个标识符以表达式的形式出现的时候被认为是其所绑定变量的值. 在引用一个标识符的时 ...
- Kubernetes部署SpringCloud(三) 使用 Ingress-nginx 暴露服务
之前部署的zuul以及basic-info-api 都仅仅在于flannel 网络内可以访问. 现在来使用Ingress-nginx 对外暴露服务 以下用到的一些docker镜像,是存在我私有仓库的, ...
- 关于思科C2950交换机清除密码，恢复初始配置的方法
上个月河南做项目,因需要大批量的对服务器进行操作系统的安装,于是想到了PXE网络批量安装, 好不容易到机房的仓库找到网线及一台思科交换机,但到安装的时候,发现思科交换机里应该有配置了 通过配置线连接交 ...
- MFC接收命令行参数的三种方法
方法一: CString sCmdline = ::GetCommandLine(); AfxMessageBox(sCmdline); 将获取到 "C:\test\app.exe -1 - ...
- ajax 获取服务器返回的XML字符串
前台 解析失败不会抛出任何异常, 只会返回一个给定的错误文档 let l = console.log let http = ajanuw.create({ uri: 'http://localhost ...
- 170824、storm 环境搭建
/*********************storm 环境搭建 **********************/ 1 安装jdk1.7 2 安装zookeeper集群环境 3 安装Python2.6. ...