<input type="checkbox" name="checkname" onclick="check(this)"/>左
<input type="checkbox" name="checkname" onclick="check(this)"/>右 <div id="show" style="display:block;">显示</div>
<div id="hidden" style="display:none;">隐藏</div> <script type="text/javascript">
function check(obj){
var checks = document.getElementsByName("checkname");
if(obj.checked){
for(var i=0;i<checks.length;i++){
checks[i].checked = false;
}
obj.checked = true;
}else{
for(var i=0;i<checks.length;i++){
checks[i].checked = false;
}
}
document.getElementById('show').style.display = document.getElementById('show').style.display=="none"?"block":"none";
document.getElementById('hidden').style.display = document.getElementById('hidden').style.display=="none"?"block":"none";
}
</script>

用JS把复选框做成单选框,左显示div,右隐藏div的更多相关文章

  1. 【六】jquery之HTML代码/文本/值[下拉列表框、多选框、单选框的选中]

    val()方法不仅能设置元素的值,同时也能获取元素的值.另外,val()方法还有另外一个用处,就是它能使select(下拉列表框).checkbox(多选框)和radio(单选框)相应的选项被选中,在 ...

  2. Jquery学习笔记:操作form表单元素之二(复选框和单选框)

    在上面文章的基础上,我们介绍如何操作表单元素中的 复选框和单选框. 一.复选框 <label> <input type="checkbox" id="i ...

  3. 【三石jQuery视频教程】02.创建 FontAwesome 复选框和单选框

    视频地址:http://v.qq.com/page/m/8/c/m0150izlt8c.html 大家好,欢迎来到[三石jQuery视频教程],我是您的老朋友 - 三生石上. 今天,我们要通过基本的H ...

  4. Bootstrap 表单和图片 (内联表单,表单合组,水平排列,复选框和单选框,下拉列表,校验状态,添加额外的图标,控制尺寸,图片)

    一.表单 基本格式 注:只有正确设置了输入框的 type 类型,才能被赋予正确的样式. 支持的输入框控件 包括:text.password.datetime.datetime-local.date.m ...

  5. html+css+js实现复选框全选与反选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  6. 把复选框变成单选框(prop,attr的区别)

    如果项目中需要统一样式的话,有可能会遇到把复选框变成单选框的需求. 下面是用jquery的简单实现 $(function(){ $("input[type='checkbox']" ...

  7. js实现复选框的全选、全不选和反选

    js实现复选框的全选.全不选和反选 主要是用遍历的方法查找元素,然后通过改变checked的属性来选择,为true则是选中状态,为false则是未选状态 实现代码 <!DOCTYPE html& ...

  8. 10个HTML5美化版复选框和单选框

    单选框Radiobox和复选框checkbox在网页中也十分常见,虽然它没有按钮的交互性强,但是如果能把它们像按钮那样美化一下,那也是非常不错的.本文收集了10个相对比较漂亮的美化版单选框和复选框,希 ...

  9. js input复选框选中父级同时子级也选中

    js实现复选框选中父级元素子级元素也选中,没有子级元素选中父级也不选中的效果 HTML <tr> <td> <label> <input name=" ...

随机推荐

  1. java 对象 拆箱装箱 编译和反编译的验证

    创建对象 package 创建对象的个数; public class main { public static void main(String[] agrs){ Check c1=new Check ...

  2. C语言程序设计:现代方法阅读笔记

    第二十六章 atexit函数允许用户“注册”在程序终止时要调用的函数:atexit(func); 在程序终止后,func函数会被自动调用 clock()函数可以计算程序运行时间 time函数返回当前的 ...

  3. 远程登录工具 —— filezilla(FTP vs. SFTP)、xshell、secureCRT

    filezilla:是一个免费开源的 FTP 软件,分为客户端版本和服务器版本,具备所有的 FTP 软件功能. 支持的协议:FTP & SFTP(Secure File Transfer Pr ...

  4. WebBrowser获取页面总高度

    case DISPID_DOCUMENTCOMPLETE: { #pragma region 获取页面总高度 HRESULT hr; IDispatch *pdisp; hr = m_pWebBrow ...

  5. android之软件键盘

    不弹出软件键盘 <activity android:name="PresCompleteActivity"              android:windowSoftIn ...

  6. AngularJs轻松入门(四)模块化

    在前面几节教程中,代码比较少,为了方便说明问题笔者將控制器代码都写在了HTML页面中,实际上这并不是什么好的编程习惯,而且可维护性差.通常的做法都是將处理业务逻辑的代码写在一个单独的JS文件中,然后在 ...

  7. <Sicily>数字反转

    一.题目描述 给定一个整数,请将该数各个位上数字反转得到一个新数.新数也应满足整数的常见形式,即除非给定的原数为零,否则反转后得到的新数的最高位数字不应为零(参见样例2). 二.输入 输入共 1 行, ...

  8. 51Nod 天堂里的游戏

    多年后,每当Noder看到吉普赛人,就会想起那个遥远的下午. Noder躺在草地上漫无目的的张望,二楼的咖啡馆在日光下闪着亮,像是要进化成一颗巨大的咖啡豆.天气稍有些冷,但草还算暖和.不远的地方坐着一 ...

  9. JACOB调用控件函数

    背景介绍: 使用JAVA程序,实现对系统已安装控件方法的调用. JACOB下载地址:http://danadler.com/jacob/ 使用方法: 1.将jacob.jar添加到项目工程中 2.将j ...

  10. zabbix2.4.5安装zatree插件

    一.关于zatree zatree 是来自国内58公司开发的监控软件zabbix的一个插件,主要功能是提供host group的树形展示和在item里指定关键字查询及数据排序. 项目地址:https: ...