用JS把复选框做成单选框,左显示div,右隐藏div
<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的更多相关文章
- 【六】jquery之HTML代码/文本/值[下拉列表框、多选框、单选框的选中]
val()方法不仅能设置元素的值,同时也能获取元素的值.另外,val()方法还有另外一个用处,就是它能使select(下拉列表框).checkbox(多选框)和radio(单选框)相应的选项被选中,在 ...
- Jquery学习笔记:操作form表单元素之二(复选框和单选框)
在上面文章的基础上,我们介绍如何操作表单元素中的 复选框和单选框. 一.复选框 <label> <input type="checkbox" id="i ...
- 【三石jQuery视频教程】02.创建 FontAwesome 复选框和单选框
视频地址:http://v.qq.com/page/m/8/c/m0150izlt8c.html 大家好,欢迎来到[三石jQuery视频教程],我是您的老朋友 - 三生石上. 今天,我们要通过基本的H ...
- Bootstrap 表单和图片 (内联表单,表单合组,水平排列,复选框和单选框,下拉列表,校验状态,添加额外的图标,控制尺寸,图片)
一.表单 基本格式 注:只有正确设置了输入框的 type 类型,才能被赋予正确的样式. 支持的输入框控件 包括:text.password.datetime.datetime-local.date.m ...
- html+css+js实现复选框全选与反选
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- 把复选框变成单选框(prop,attr的区别)
如果项目中需要统一样式的话,有可能会遇到把复选框变成单选框的需求. 下面是用jquery的简单实现 $(function(){ $("input[type='checkbox']" ...
- js实现复选框的全选、全不选和反选
js实现复选框的全选.全不选和反选 主要是用遍历的方法查找元素,然后通过改变checked的属性来选择,为true则是选中状态,为false则是未选状态 实现代码 <!DOCTYPE html& ...
- 10个HTML5美化版复选框和单选框
单选框Radiobox和复选框checkbox在网页中也十分常见,虽然它没有按钮的交互性强,但是如果能把它们像按钮那样美化一下,那也是非常不错的.本文收集了10个相对比较漂亮的美化版单选框和复选框,希 ...
- js input复选框选中父级同时子级也选中
js实现复选框选中父级元素子级元素也选中,没有子级元素选中父级也不选中的效果 HTML <tr> <td> <label> <input name=" ...
随机推荐
- unity Android在streamingAssets路径下文件无法读取的的解决方法
unity Android在streamingAssets路径下文件,有时候plugin下的.jar或者.so无法直接读取: 解决方法之一,拷贝至其他路径: #if UNITY_ANDROID str ...
- GenIcam标准(一)
1.概述 如今的数码摄相机包含了很多的功能,而不仅仅是采集图像.对于机器视觉相机来说,处理图像并把结果附加到图像数据流上,控制附加的硬件,代替应用程序作实时的处理等都是很平常的事情.这也导致了相机的编 ...
- Android笔记——Activity中的数据传递案例(用户注冊)
1.创建程序activity_main: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/andro ...
- light oj 1094 Farthest Nodes in a Tree(树的直径模板)
1094 - Farthest Nodes in a Tree problem=1094" style="color:rgb(79,107,114)"> probl ...
- Android SQLite 简单使用演示样例
SQLite简单介绍 Google为Andriod的较大的数据处理提供了SQLite,他在数据存储.管理.维护等各方面都相当出色,功能也很的强大. 袖珍型的SQLite能够支持高达2TB大小的数据库, ...
- tomcat和nginx相互结合的优化调整
在工作中遇到这样的情况 Tomcat为后台 nginx为反向代理 需要往后台导入数据,由于处理时间过长,导致访问时出现504和500 通过修改tomcat中maxParameterCount=&qu ...
- [BZOJ4289] [PA2012] Tax 解题报告 (最短路+差分建图)
题目链接:https://www.lydsy.com/JudgeOnline/problem.php?id=4289 4289: PA2012 Tax Time Limit: 10 Sec Memo ...
- [HNOI2008] GT考试(DP+矩阵快速幂+KMP)
题目链接:https://www.luogu.org/problemnew/show/P3193#sub 题目描述 阿申准备报名参加 GT 考试,准考证号为 N 位数 X1,X2…Xn(0 <= ...
- Python TurtleWorld configuration and simple test
TurtleWorld provides a set of functions for drawing lines by steering turtles around the screen. You ...
- [-] Failed to load plugin from /usr/share/metasploit-framework/plugins/db_autopwn: No classes were loaded from /usr/share/metasploit-framework/plugins/db_autopwn in the Msf::Plugin namespace.
问题详情 然后,执行,出现如下问题,则说明大家的这个文件,下载不是完整的或者你上传不完整. msf > load db_autopwn [-] Failed to load plugin fro ...