将多选框选中时打勾的颜色- Javascript

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 将多选框选中时打勾的颜色

Javascript: 用jQuery解决IE不支持的option disable属性; jQuery 源代码显示控件 (Ajax加载方式).; JS backgroundImage控制; jQuery 性能优化指南（1）; jQuery 性能优化指南（2）; jQuery 性能优化指南（3）; input+select(multiple) 实现下拉框输入值; javascript getBoundingClientRect() 来获取页面元素的位置的代码[修正版]; jQuery 图像裁剪插件Jcrop的简单使用; 让GoogleCode的SVN下的HTML文件在FireFox下正常显示.; jquery(1.3.2) 斑马线效果代码; JQuery Jcrop 实现图片裁剪的插件; jquery img src 获取实现代码; javascript 历史记录经常用于产品最近历史浏览; jquery tabs的实现代码; jQuery 剧场版你必须知道的javascript; JavaScript 闭包深入理解(closure); js 图片缩放（按比例）控制代码; 广告切换效果(缓动切换); javascript 用局部变量来代替全局变量

No. « ‹ 219 220 221 222 › »

技术文章搜索

关键字

Javascript 中的将多选框选中时打勾的颜色

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-12 浏览: 425 ::

收藏到网摘: n/a

按键测试，支持像 Ctrl+Alt+Shift+T 的组合键脚本和web页共用同一个文件测试

点击运行可以看到效果:

<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 全选提示:你可先修改部分代码,再按运行]

按键测试，支持像 Ctrl+Alt+Shift+T 的组合键脚本和web页共用同一个文件测试

Javascript 中的 将多选框选中时打勾的颜色

评论 (0) All

Javascript 中的将多选框选中时打勾的颜色