<!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>
分享到:
相关推荐
7. **兼容性考虑**:虽然jQuery库对浏览器的兼容性很好,但仍然需要测试在不同浏览器(如IE8+、Chrome、Firefox、Safari等)上的表现,以确保功能正常运行。 总之,"JQ全选和反选和取消"是一个常见且实用的前端交互...
此购物车插件应该经过优化,可以在主流浏览器如Chrome、Firefox、Safari和Edge等上正常运行。 综上所述,"jquery插件库-jquery添加购物车复选框,全选,反选,取消商品数量统计.zip"是一个专门为网页购物车功能设计...
这个场景中,我们讨论的是一个针对多选框(checkbox)实现全选、反选功能的JS代码,该代码旨在解决在Internet Explorer(IE)和Firefox这两个主流浏览器中的兼容性问题。 首先,我们来看一下提供的代码片段: ```...
2. **跨浏览器兼容性**:由于不同的浏览器对某些CSS样式和JavaScript API支持可能存在差异,我们需要确保代码在Internet Explorer(IE)和Firefox等主要浏览器上都能正常工作。这可能需要使用条件注释、jQuery等库...
通过上述修改,我们可以确保在各种浏览器中,包括Firefox,CheckBox列的全选/反选功能都能正常运行。这对于提升用户界面的可用性和统一性至关重要。在Web开发中,考虑到浏览器之间的差异,确保代码的跨浏览器兼容性...
修复Firefox下的padding导致的错位问题 修复thead复制没有底部分割线的问题 修复thead复制时无背景色的问题 增加复选框同步功能(如果是JS代码设置复选框选中,需要调用 .setCheckBoxSync()方法) ....
基于JQuery EasyUI开发的权限管理系统源码 ...4.兼容 IE/Firefox /Google Chrome 这些浏览器都测试过 5.批量删除,自定义复选框样式,可以全选/反选 6.角色分级,集团和分公司的关系。 该源码比较适合二次开发。
基于JQuery EasyUI开发的权限管理系统源码 ...4.兼容 IE/Firefox /Google Chrome 这些浏览器都测试过 5.批量删除,自定义复选框样式,可以全选/反选 6.角色分级,集团和分公司的关系。 该源码比较适合二次开发。
在描述的场景中,开发者在尝试使用jQuery实现复选框的全选和反选功能,使用的代码如下: ```javascript var ischecked = allCheckObj.is(':checked'); ischecked ? checksObj.attr('checked', true) : checksObj....
例如,示例中的部分代码在FireFox浏览器中不能正常工作,后来发现正确的做法是使用`$("[name='checkbox']:checked")`选择器来替代原来的代码。 在实现上述功能时,代码需要在`$(document).ready()`函数中执行,确保...
例如,文中提到在 IE 浏览器下可以正常工作,而在 Firefox 浏览器下却无法实现反选效果。 这是因为 jQuery 的 attr() 方法在某些情况下对 checked 属性的处理可能不符合原生 DOM 的行为。一个更可靠的方法是直接...
7.兼容 IE6,7,8,9 /Firefox /Google Chrome 这些浏览器都测试过 8.批量删除,自定义复选框样式,可以全选/反选 9.角色分级,集团和分公司的关系 10.权限 横向就是业务部分,具体负责哪块业务,纵向是级别 11.动态...
16.兼容 IE6,7,8,9 /Firefox /Google Chrome 这些浏览器都测试过 17.批量删除,自定义复选框样式,可以全选/反选 18.角色分级,集团和分公司的关系 19.权限 横向就是业务部分,具体负责哪块业务,纵向是级别 特点...
在某些版本的jQuery和浏览器中,使用`$("input[name='checkbox'][checked]")`可能无法正确获取选中项,特别是在Firefox和Chrome中。这是因为`[checked]`是一个属性选择器,而不是一个状态选择器。为了解决这个问题,...
本文将重点分析在火狐(Firefox)浏览器下,使用jQuery的prop和attr方法来设置checkbox选中状态的不同表现和解决方法。 首先,需要了解的是,在jQuery中,attr方法是用来获取或设置HTML属性的值,而prop方法则是...
7.兼容 IE6,7,8,9 /Firefox /Google Chrome 这些浏览器都测试过 8.批量删除,自定义复选框样式,可以全选/反选 9.角色分级,集团和分公司的关系 10.权限 横向就是业务部分,具体负责哪块业务,纵向是级别 11.动态...
这款插件特别适用于那些需要在Internet Explorer、Firefox和Chrome等主流浏览器上运行的项目。 **2. 兼容性** jQuery.Select插件经过优化,能够很好地兼容多个浏览器,包括老版本的Internet Explorer,这在跨...
layui Transfer 具有良好的跨浏览器兼容性,支持主流的现代浏览器,如Chrome、Firefox、Edge等。同时,它可以通过模块化加载,与其他layui组件或第三方库结合使用,如Vue、React等。 总之,“基于layui实现带搜索...