如何把checkbox做成radio一样的单选效果
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>复选框checkbox类似单选按钮radio</title>
</head>
<body>
<form method=post action="">
<input type="checkbox" name="aa" onclick="bb(this)">
<input type="checkbox" name="aa" onclick="bb(this)">
<input type="checkbox" name="aa" onclick="bb(this)">
<input type="checkbox" name="aa" onclick="bb(this)">
<input type="checkbox" name="aa" onclick="bb(this)">
</form>
<script src="js/jQuery-2.2.0.min.js"></script>
<script type="text/javascript">
function bb(obj){
var aa = document.forms[0].aa;
for (var i = 0; i < aa.length; i++) {
aa[i].checked = false;
}
obj.checked = true;
}
</script>
</body>
</html>
如何把checkbox做成radio一样的单选效果的更多相关文章
- 为什么radio没有出现单选效果?
原因是radio一定要设置相同的name,如下: <input type="radio" name="yunsuan" checked="che ...
- 论checkbox和radio的样式美化问题
如果你下定决心要改变现有的默认的checkbox和radio的样式,那么我目前有两种办法: 1.自己动手写一个,也就是自己写代码实现将input的checkbox和radio默认的样式隐藏掉,使用绝对 ...
- ztree点击文字勾选checkbox,radio实现方法
ztree的复选框checkbok,单选框radio是用背景图片来模拟的,所以点击文字即使用label括起checkbox,radio文字一起,点击文字也是无法勾选checkbox. 要想点击ztre ...
- 优化checkbox和radio,类似Bootstrap中的iCheck
checkbox和radio浏览器默认的已经满足不了大众的审美需求,更不用说浏览器之间的差异化,取而代之,优化checkbox和radio的方法也随之诞生了. html结构:单选框为例,简单说明: 其 ...
- input美化 checkbox和radio样式
input美化 checkbox和radio样式 看惯了input[checkbox]和input[radio]默认样式,有没有想要改变一下呢?比如下面的样式: 比起html默认的样式,上图这些 ...
- html自定义checkbox、radio、select —— select篇
上一篇<html自定义checkbox.radio.select —— checkbox.radio篇>介绍了我们是怎么将 html 自带的 checkbox.radio 改成我们自定义的 ...
- asp.mvc获取checkbox、radio、select的值
记录一下在asp.mvc中,提交表单时后台获取checkbox.radio.select值的方法. 1.获取select的值 <select name="type"> ...
- 第19讲- UI组件之_Button、checkbox、radio
第19讲 UI组件之_Button.checkbox.radio 四.按钮Button Button继承自TextView,间接继承自View.当用户对按钮进行操作的时候,触发相应事件,如点击,触摸. ...
- checkbox 实现单选效果(html)
note:在html <input> 标签类中的checkbox实现单选效果. 在最近的开发项目中,客户要求使用小方格子实现“单选”功能,显然圆点的radio被out了,只能选择chckb ...
随机推荐
- flutter 自己整理
2018-05 资料 常见问题解决处 https://flutter.io/flutter-for-android/ 起步 api widget https://flutter.io/docs/ 其他 ...
- [leetcode]53. Maximum Subarray最大子数组和
Given an integer array nums, find the contiguous subarray (containing at least one number) which has ...
- ES6 Iterator
不同数据集合怎么用统一的方式读取 可以用for...of循环了
- Py西游攻关之RabbitMQ、Memcache、Redis
Py西游攻关之RabbitMQ.Memcache.Redis RabbitMQ 解释RabbitMQ,就不得不提到AMQP(Advanced Message Queuing Protocol)协议 ...
- php设计模式-工厂模式(一)
<?php abstract class Creator{ /* startFactory 返回一个具体的产品 factoryMethod 返回对象 */ protected abstract ...
- vs2015调试断点无法命中
问题描述: 我是从vc6.0的原工程导入的,用vs2015编译,在断点调试的时候遇到问题,断点无法命中; 修改方法:工程->属性->C/C++ 常规->调试信息格式->设置为C ...
- JavaSE 初学进度条JProgressBar
预备知识 创建进度条类后将其直接加入JFrame看看效果 public class JProgressBarDemo2 { public static void main(String args[]) ...
- Linux环境下java开发环境搭建二 tomcat搭建
第一步:下载安装包并解压 # tar zxvf 压缩包名 第二步:把解压出的文件移动到/usr/local/tomcat7中 #mv 解压出来的文件夹 /usr/local/tomcat7 第三步: ...
- python之高阶函数
1.函数的参数能接收变量 def calc(x): return x*x n = 10 print(calc(n)) #输出为100 2.变量指向函数 def calc(x): return x*x ...
- Linux下配置yum
[一]用本地文件创建本地yum源 1. 创建iso存放目录和挂载目录 mkdir /mnt/iso mkdir /mnt/cdrom 2. 将iso镜像文件上传到/mnt/iso文件夹下 3. 将/m ...