var box=document.getElementById('box'), chs=box.getElementsByTagName('apan'); function selAll(b){ for(i=0;i<chs.length;i++) chs[i].innerHTML=b?'√':'╳'; } function sel(evt){ var el=window.event? event.srcElement: evt.target; if(el.className=='chBox'){ el.innerHTML=el.innerHTML.indexOf('√')==0?'╳':'√'; } } </script>
var imgs=[ 'http://forum.csdn.net/PointForum/ui/scripts/csdn/Plugin/003/onion/1.gif', //未选中的图 'http://forum.csdn.net/PointForum/ui/scripts/csdn/Plugin/003/onion/9.gif' //选中的图 ] var box=document.getElementById('box'), chs=document.getElementsByName('chImg');
function selAll(b){ for(i=0;i<chs.length;i++) chs[i].src=b?imgs[1]:imgs[0]; } function sel(evt){ var el=window.event? event.srcElement: evt.target; if(el.tagName=='IMG'){ el.src=el.src.indexOf('1.gif')!=-1?imgs[1]:imgs[0]; } } </script>
<style>
.chBox{
padding:3px;
overflow:hidden;
color:#6e6;
border:1px solid #ccc;
font-weight: bold;
cursor: pointer;
}
</style>
<div onclick="sel()" id="box" >
<apan class="chBox">√</apan>
<apan class="chBox">√</apan>
</div>
<button onclick="selAll(true)">全选</button> <button onclick="selAll(false)">反选</button>
<script>
var box=document.getElementById('box'),
chs=box.getElementsByTagName('apan');
function selAll(b){
for(i=0;i<chs.length;i++)
chs[i].innerHTML=b?'√':'╳';
}
function sel(evt){
var el=window.event? event.srcElement: evt.target;
if(el.className=='chBox'){
el.innerHTML=el.innerHTML.indexOf('√')==0?'╳':'√';
}
}
</script>
改成
chs[i].innerHTML=b?'<img src="选中的RUL">':'<img src="未选中的RUL">';
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
.chBox{
padding:3px;
overflow:hidden;
color:#6e6;
border:1px solid #ccc;
font-weight: bold;
cursor: pointer;
}
</style>
</head><body>
<div id="box">
<apan class="chBox">√</apan>
<apan class="chBox">√</apan>
</div>
<button onclick="selAll(true)">全选</button> <button onclick="selAll(false)">反选</button>
<script type="text/javascript">
var box=document.getElementById('box'),
chs=box.getElementsByTagName('apan');
function selAll(b){
for(i=0;i<chs.length;i++)
chs[i].innerHTML=b?'√':'╳';
}
function sel(evt){
evt = evt || window.event;
var el = evt.target || evt.srcElement;
//var el=window.event? window.event.srcElement: evt.target;
if(el.className=='chBox'){
el.innerHTML=el.innerHTML.indexOf('√')==0?'╳':'√';
}
}
document.getElementById('box').onclick = sel;
</script>
</body>
</html>
.chBox{
padding:3px;
overflow:hidden;
color:#6e6;
border:1px solid #ccc;
font-weight: bold;
cursor: pointer;
}
</style>
<div onclick="sel()" id="box" >
<apan class="chBox">aa<img name="chImg" src="http://forum.csdn.net/PointForum/ui/scripts/csdn/Plugin/003/onion/1.gif" /></apan>
<apan class="chBox">bb<img name="chImg" src="http://forum.csdn.net/PointForum/ui/scripts/csdn/Plugin/003/onion/1.gif" /></apan>
</div>
<button onclick="selAll(true)">全选</button> <button onclick="selAll(false)">反选</button>
<script>
var imgs=[
'http://forum.csdn.net/PointForum/ui/scripts/csdn/Plugin/003/onion/1.gif', //未选中的图
'http://forum.csdn.net/PointForum/ui/scripts/csdn/Plugin/003/onion/9.gif' //选中的图
]
var box=document.getElementById('box'),
chs=document.getElementsByName('chImg');
function selAll(b){
for(i=0;i<chs.length;i++)
chs[i].src=b?imgs[1]:imgs[0];
}
function sel(evt){
var el=window.event? event.srcElement: evt.target;
if(el.tagName=='IMG'){
el.src=el.src.indexOf('1.gif')!=-1?imgs[1]:imgs[0];
}
}
</script>