<!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一样的单选效果的更多相关文章

  1. 为什么radio没有出现单选效果？

    原因是radio一定要设置相同的name,如下: <input type="radio" name="yunsuan" checked="che ...

  2. 论checkbox和radio的样式美化问题

    如果你下定决心要改变现有的默认的checkbox和radio的样式,那么我目前有两种办法: 1.自己动手写一个,也就是自己写代码实现将input的checkbox和radio默认的样式隐藏掉,使用绝对 ...

  3. ztree点击文字勾选checkbox，radio实现方法

    ztree的复选框checkbok,单选框radio是用背景图片来模拟的,所以点击文字即使用label括起checkbox,radio文字一起,点击文字也是无法勾选checkbox. 要想点击ztre ...

  4. 优化checkbox和radio，类似Bootstrap中的iCheck

    checkbox和radio浏览器默认的已经满足不了大众的审美需求,更不用说浏览器之间的差异化,取而代之,优化checkbox和radio的方法也随之诞生了. html结构:单选框为例,简单说明: 其 ...

  5. input美化 checkbox和radio样式

    input美化    checkbox和radio样式 看惯了input[checkbox]和input[radio]默认样式,有没有想要改变一下呢?比如下面的样式: 比起html默认的样式,上图这些 ...

  6. html自定义checkbox、radio、select —— select篇

    上一篇<html自定义checkbox.radio.select —— checkbox.radio篇>介绍了我们是怎么将 html 自带的 checkbox.radio 改成我们自定义的 ...

  7. asp.mvc获取checkbox、radio、select的值

    记录一下在asp.mvc中,提交表单时后台获取checkbox.radio.select值的方法. 1.获取select的值 <select name="type"> ...

  8. 第19讲- UI组件之_Button、checkbox、radio

    第19讲 UI组件之_Button.checkbox.radio 四.按钮Button Button继承自TextView,间接继承自View.当用户对按钮进行操作的时候,触发相应事件,如点击,触摸. ...

  9. checkbox 实现单选效果（html）

    note:在html <input> 标签类中的checkbox实现单选效果. 在最近的开发项目中,客户要求使用小方格子实现“单选”功能,显然圆点的radio被out了,只能选择chckb ...

随机推荐

  1. flutter 自己整理

    2018-05 资料 常见问题解决处 https://flutter.io/flutter-for-android/ 起步 api widget https://flutter.io/docs/ 其他 ...

  2. [leetcode]53. Maximum Subarray最大子数组和

    Given an integer array nums, find the contiguous subarray (containing at least one number) which has ...

  3. ES6 Iterator

    不同数据集合怎么用统一的方式读取 可以用for...of循环了

  4. Py西游攻关之RabbitMQ、Memcache、Redis

    Py西游攻关之RabbitMQ.Memcache.Redis   RabbitMQ 解释RabbitMQ,就不得不提到AMQP(Advanced Message Queuing Protocol)协议 ...

  5. php设计模式-工厂模式(一)

    <?php abstract class Creator{ /* startFactory 返回一个具体的产品 factoryMethod 返回对象 */ protected abstract ...

  6. vs2015调试断点无法命中

    问题描述: 我是从vc6.0的原工程导入的,用vs2015编译,在断点调试的时候遇到问题,断点无法命中; 修改方法:工程->属性->C/C++ 常规->调试信息格式->设置为C ...

  7. JavaSE 初学进度条JProgressBar

    预备知识 创建进度条类后将其直接加入JFrame看看效果 public class JProgressBarDemo2 { public static void main(String args[]) ...

  8. Linux环境下java开发环境搭建二 tomcat搭建

    第一步:下载安装包并解压 # tar zxvf 压缩包名 第二步:把解压出的文件移动到/usr/local/tomcat7中 #mv 解压出来的文件夹  /usr/local/tomcat7 第三步: ...

  9. python之高阶函数

    1.函数的参数能接收变量 def calc(x): return x*x n = 10 print(calc(n)) #输出为100 2.变量指向函数 def calc(x): return x*x ...

  10. Linux下配置yum

    [一]用本地文件创建本地yum源 1. 创建iso存放目录和挂载目录 mkdir /mnt/iso mkdir /mnt/cdrom 2. 将iso镜像文件上传到/mnt/iso文件夹下 3. 将/m ...