<!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. 348. Design Tic-Tac-Toe设计井字游戏

    ［抄题］: Design a Tic-tac-toe game that is played between two players on a n x n grid. You may assume t ...

  2. [leetcode]86. Partition List划分链表

    Given a linked list and a value x, partition it such that all nodes less than x come before nodes gr ...

  3. python积累二：中文乱码解决方法

    根据网上提供的解决方法:添加#coding=utf-8或# -*- coding: utf-8 -*- #coding=utf-8 print "还不行?" 执行结果:还是乱码!: ...

  4. 使用U盘安装CentOS7

    为了在公司的旧笔记本电脑上安装centos供自己学习使用折腾了两天,终于在看了https://www.cnblogs.com/yeeo1/p/7306611.html这篇博文后装上了, 以下内容为转载 ...

  5. js多维数组转一维数组

    1,使用map方法 var arr = [1,[2,[[3,4],5],6]]; function unid(arr){ var arr1 = (arr + '').split(',');//将数组转 ...

  6. MySQL优化（四） 慢查询的定位及优化

    一.SQL语句优化的一般步骤: (1)通过 show status 命令了解各种 SQL 的执行效率: (2)定位执行效率较低的 SQL 语句(重点是 Select): (3)通过 explain 分 ...

  7. python_paramiko

    目录: paramiko模块介绍 paramiko模块安装 paramiko模块使用 一.paramiko模块介绍 paramiko是一个用于做远程控制的模块,使用该模块可以对远程服务器进行命令或文件 ...

  8. 重写comparater比较器

    TreeSet 能自动对对象进行排序,但是一般需要在类中重写比较方法 比较器介绍 在类中实现Comparable接口,并重写compareTo方法 排序对象类 package typing.overr ...

  9. 《Linux就该这么学》第五天课程

    今天我很迷茫! 一下是一些命令的整合 原创地址:https://www.linuxprobe.com/chapter-04.html 下面是Linux系统中最重要的10个环境变量 变量名称 作用 HO ...

  10. Servlet的补充知识

    ServletContextAware是获取ServletContext一个接口.只需要实现此接口重写里面的setServletContext方法,spring在初始化的时候通过xmlClasspat ...