<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <meta http-equiv="Content-Language" content="zh-CN"> <meta name="generator" content="editplus"> <meta name="author" content="dron"> <meta name="keywords" content="dron"> <meta name="description" content="dron"> <style type="text/css"> body { font-size:12px; } .checkbox { width:12px; height:12px; background-image:url(http://ucren.com/files/WebTex/setCheckbox/images/checkbox.gif); background-color:#fff; line-height:1px; font-size:1px; } </style> </head> <body> <div class="checkbox"></div> <div class="checkbox"></div> <div class="checkbox" checked=true></div> <div class="checkbox"></div> <div class="checkbox" checked=true></div> <div>将多选框选中时打勾的颜色设为：<input type="text" size="7" maxlength="7" value="#0000ff" id="colorValue"><input type="button" value="试试" onclick="setActColor(document.getElementById('colorValue').value)">（注：颜色值可以自行更改）</div> <script type="text/javascript"> /*******************************************\ 自定义 checkbox 打勾颜色的例子 This JavaScript was writen by Dron. @2003-2008 Ucren.com All rights reserved. \*******************************************/ var actColor = "#f00"; var divs = document.getElementsByTagName("div"); for(var i=0;i<divs.length;i++) { if(divs[i].className=="checkbox") { divs[i].onclick = function() { var tempvalue = this.getAttribute("checked") ? '' : true; this.setAttribute("checked",tempvalue); return setcheck(); } } } function setcheck() { var divs = document.getElementsByTagName("div"); for(var i=0;i<divs.length;i++) { if(divs[i].className=="checkbox"&&divs[i].getAttribute("checked")) { divs[i].style.backgroundColor = actColor; } if(divs[i].className=="checkbox"&&(!divs[i].getAttribute("checked"))) { divs[i].style.backgroundColor = "#fff"; } } } function setActColor(str) { var body = document.body; try { body.style.color = str; body.style.color = "#000"; } catch(e) { window.alert("填定了错误的颜色值。"); return; } actColor = str; return setcheck(); } setcheck(); </script> </body> </html> [Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
