前端 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 ...
随机推荐
- Oracle Enterprise Linux 6.4 下挂载ISCSI 设备
Oracle Enterprise Linux 6.4 下挂载ISCSI 设备一.发现① 要求安装iscsi客户端软件 yum install iscsi-initiator-utils ② 发现 ...
- 将 GitHub 上的代码向 Coding 更新
问题: 从 GitHub 上 clone 代码到本地很慢,10 KB/s 左右,为了解决这个问题,尝试将 GitHub 上的代码通过离线下载的方式,用百度云和115网盘下载,经常失败,弃之~ 国内也有 ...
- linux swoole
swoole安装需要:linux7 +php5.3.10以上版本+gcc-4.4 或更高版本 下载地址: https://github.com/swoole/swoole-src/releases h ...
- oracle 学习笔记（2）创建表空间及用户授权
原文:http://www.cnblogs.com/smartvessel/archive/2009/07/06/1517690.html Oracle安装完后,其中有一个缺省的数据库,除了这个缺省的 ...
- PHP_CodeSniffer HG 服务端部署篇
环境:CentOs 6.7 语言:PHP5.4 PHP_CodeSniffer: https://github.com/phpdragon/PHP_CodeSniffer 本地代码检测请查看该文章:h ...
- 转载->CPU的内部架构和工作原理
CPU的内部架构和工作原理 本片博客转自:http://www.cnblogs.com/onepixel/p/8724526.html 感谢博主分享! 内部架构 CPU 的根本任务就是执行指令,对计 ...
- MySql 5.7 新特性概览
安全的提升 1.1 在Mysql 8版本中,caching_sha2_password 是一个缺省的认证插见.5.7 版本的客户端支持 caching_sha2_password 的客户端认证. 1. ...
- python string.py 源码分析 二：capwords
def capwords(s, sep=None): """capwords(s [,sep]) -> string Split the argument into ...
- D - Game Prediction
Suppose there are M people, including you, playing a special card game. At the beginning, each playe ...
- redis（三）--用Redis作为Mysql数据库的缓存
把MySQL结果集缓存到Redis的字符串或哈希结构中以后,我们面临一个新的问题,即如何为这些字符串或哈希命名,也就是如何确定它们的键.因为这些数据结构所对应的行都属于某个结果集,假如可以找到一种唯一 ...