`

全选 不全选 反选 兼容火狐代码

阅读更多
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>demo3.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

  </head>
  
  <body>
   请选择您的兴趣爱好<br>
	<input type='checkbox' id='yncheck'>全选/全不选</br>
	<input type="checkbox" name='hobby'>足球
	<input type="checkbox"  name='hobby'>篮球
	<input type="checkbox"  name='hobby'>桌球
	<input type="checkbox"  name='hobby'>乒乓球
	<input type="checkbox"  name='hobby'>羽毛球<br>
	<input id='allbutton' type='button' value='全选'>
	<input id='nobutton' type='button' value='全不选'>
	<input type='button' value='反选' id='unbutton'></br>
	<script language='JavaScript'>
		var allbutton = document.getElementById('allbutton');
		var nobutton = document.getElementById('nobutton');
		var hobby =   document.getElementsByName('hobby');
		var yncheck  =document.getElementById("yncheck")
		var unbutton  =document.getElementById("unbutton")
		
		
		allbutton.onclick= function(){
			for(var x=0;x<hobby.length;x++){
				//下面代码 不兼容火狐
				//hobby[x].setAttribute('checked','checked');
				hobby[x].checked='checked';
			}
		};
		var nobutton = document.getElementById('nobutton');
		
		nobutton.onclick = function(){
			for(var x=0;x<hobby.length;x++){
//				hobby[x].setAttribute('checked',null);
				hobby[x].checked=null;
			}
		}
		yncheck.onclick=function(){
//			if(!yncheck.getAttribute('checked')){
			if(!this.checked){
				for(var x=0;x<hobby.length;x++){
//				hobby[x].setAttribute('checked',null);
				hobby[x].checked=null;
				}
			}else{
				for(var x=0;x<hobby.length;x++){
//				hobby[x].setAttribute('checked','checked');
				hobby[x].checked='checked';
				}
			}
		}
		unbutton.onclick=function(){
			for(var x=0;x<hobby.length;x++){
//				if(hobby[x].getAttribute('checked')){
				if(hobby[x].checked){
//					hobby[x].setAttribute('checked',null);
					hobby[x].checked=null;
				}else{
//					hobby[x].setAttribute('checked','checked');
					hobby[x].checked='checked';
				}
			}
		}
	</script>
  </body>
</html>

 

分享到:
评论

相关推荐

    JQ 全选和反选和取消

    7. **兼容性考虑**:虽然jQuery库对浏览器的兼容性很好,但仍然需要测试在不同浏览器(如IE8+、Chrome、Firefox、Safari等)上的表现,以确保功能正常运行。 总之,"JQ全选和反选和取消"是一个常见且实用的前端交互...

    jquery插件库-jquery添加购物车复选框,全选,反选,取消商品数量统计.zip

    此购物车插件应该经过优化,可以在主流浏览器如Chrome、Firefox、Safari和Edge等上正常运行。 综上所述,"jquery插件库-jquery添加购物车复选框,全选,反选,取消商品数量统计.zip"是一个专门为网页购物车功能设计...

    兼容ie和firefox版本的js反选 全选 多选框

    这个场景中,我们讨论的是一个针对多选框(checkbox)实现全选、反选功能的JS代码,该代码旨在解决在Internet Explorer(IE)和Firefox这两个主流浏览器中的兼容性问题。 首先,我们来看一下提供的代码片段: ```...

    Javascript表格高级操作

    2. **跨浏览器兼容性**:由于不同的浏览器对某些CSS样式和JavaScript API支持可能存在差异,我们需要确保代码在Internet Explorer(IE)和Firefox等主要浏览器上都能正常工作。这可能需要使用条件注释、jQuery等库...

    让GridView中CheckBox列支持FireFox

    通过上述修改,我们可以确保在各种浏览器中,包括Firefox,CheckBox列的全选/反选功能都能正常运行。这对于提升用户界面的可用性和统一性至关重要。在Web开发中,考虑到浏览器之间的差异,确保代码的跨浏览器兼容性...

    JS固定表头和左边列V2.0(源码)

    修复Firefox下的padding导致的错位问题 修复thead复制没有底部分割线的问题 修复thead复制时无背景色的问题 增加复选框同步功能(如果是JS代码设置复选框选中,需要调用 .setCheckBoxSync()方法) ....

    C#基于JQuery EasyUI开发的权限管理系统源码数据库 SQL2012源码类型 WebForm

    基于JQuery EasyUI开发的权限管理系统源码 ...4.兼容 IE/Firefox /Google Chrome 这些浏览器都测试过 5.批量删除,自定义复选框样式,可以全选/反选 6.角色分级,集团和分公司的关系。 该源码比较适合二次开发。

    MF00383-JQuery EasyUI开发权限管理源码.zip

    基于JQuery EasyUI开发的权限管理系统源码 ...4.兼容 IE/Firefox /Google Chrome 这些浏览器都测试过  5.批量删除,自定义复选框样式,可以全选/反选 6.角色分级,集团和分公司的关系。 该源码比较适合二次开发。

    解决jquery操作checkbox火狐下第二次无法勾选问题

    在描述的场景中,开发者在尝试使用jQuery实现复选框的全选和反选功能,使用的代码如下: ```javascript var ischecked = allCheckObj.is(':checked'); ischecked ? checksObj.attr('checked', true) : checksObj....

    使用jQuery获取radio/checkbox组的值的代码收集

    例如,示例中的部分代码在FireFox浏览器中不能正常工作,后来发现正确的做法是使用`$("[name='checkbox']:checked")`选择器来替代原来的代码。 在实现上述功能时,代码需要在`$(document).ready()`函数中执行,确保...

    js操作checkbox遇到的问题解决

    例如,文中提到在 IE 浏览器下可以正常工作,而在 Firefox 浏览器下却无法实现反选效果。 这是因为 jQuery 的 attr() 方法在某些情况下对 checked 属性的处理可能不符合原生 DOM 的行为。一个更可靠的方法是直接...

    通用权限管理系统

    7.兼容 IE6,7,8,9 /Firefox /Google Chrome 这些浏览器都测试过 8.批量删除,自定义复选框样式,可以全选/反选 9.角色分级,集团和分公司的关系 10.权限 横向就是业务部分,具体负责哪块业务,纵向是级别 11.动态...

    NET通用权限管理框架_ui_database

    16.兼容 IE6,7,8,9 /Firefox /Google Chrome 这些浏览器都测试过 17.批量删除,自定义复选框样式,可以全选/反选 18.角色分级,集团和分公司的关系 19.权限 横向就是业务部分,具体负责哪块业务,纵向是级别 特点...

    jQuery中获取checkbox选中项等操作及注意事项

    在某些版本的jQuery和浏览器中,使用`$("input[name='checkbox'][checked]")`可能无法正确获取选中项,特别是在Firefox和Chrome中。这是因为`[checked]`是一个属性选择器,而不是一个状态选择器。为了解决这个问题,...

    jQuery checkbox选中问题之prop与attr注意点分析

    本文将重点分析在火狐(Firefox)浏览器下,使用jQuery的prop和attr方法来设置checkbox选中状态的不同表现和解决方法。 首先,需要了解的是,在jQuery中,attr方法是用来获取或设置HTML属性的值,而prop方法则是...

    WEB通用权限管理系统源码

    7.兼容 IE6,7,8,9 /Firefox /Google Chrome 这些浏览器都测试过 8.批量删除,自定义复选框样式,可以全选/反选 9.角色分级,集团和分公司的关系 10.权限 横向就是业务部分,具体负责哪块业务,纵向是级别 11.动态...

    jQuery.Select.插件

    这款插件特别适用于那些需要在Internet Explorer、Firefox和Chrome等主流浏览器上运行的项目。 **2. 兼容性** jQuery.Select插件经过优化,能够很好地兼容多个浏览器,包括老版本的Internet Explorer,这在跨...

    基于layui实现带搜索功能的树形穿梭框

    layui Transfer 具有良好的跨浏览器兼容性,支持主流的现代浏览器,如Chrome、Firefox、Edge等。同时,它可以通过模块化加载,与其他layui组件或第三方库结合使用,如Vue、React等。 总之,“基于layui实现带搜索...

Global site tag (gtag.js) - Google Analytics