javascript美化checkbox

刚刚朋友要个美化的checkbox，要纯javascript的。好久没用过javascript了～～简单的写了几行，看看效果还不错。发上来存着。

 

/**
	 * 改变图片选中状态。并同时给设置的隐藏表单赋值
	 * 图片规则。选中图片为on_1.png,非选中图片为off_2.png。其中on_和off_不能变化，可依靠变化数字实现多种样式。
	 * valueId为需要被赋值的隐藏表单域，值为当前image的value。
	 */
	function changeCheckBox(element,valueId){
		var src = element.src;
		//得到当前选中的状态
		var checked = src.substring(src.lastIndexOf('/')+1,src.lastIndexOf('_'));
		if(checked == "on"){
			//变为非选中
			element.src=src.replace('/on_','/off_');
			document.getElementById(valueId).value = "";
		}else{
			//变为选中
			element.src=src.replace('/off_','/on_');
			document.getElementById(valueId).value = element.getAttribute('value');
		}
	}

 

 

 

<img src="images/off_1.png" class="cursor_bnt" onclick="changeCheckBox(this,'value1')" checked="false" value="值1" />
<input type="hidden" name="value1" id="value1" value="" />
<hr/>
<img src="images/off_2.png" class="cursor_bnt" onclick="changeCheckBox(this,'value2')" checked="false" value="值2"/>
<input type="hidden" name="value2" id="value2" value="" />

 

================

 

============================