jQuery checkbox 选中 取消-20130713
1、效果及功能说明
checkbox多选框点击事件控制显示隐藏
2、实现原理
点击打勾点击填写内容信息，会触发添加一个类，这个类能让下面的用户名和密码的输入框填写当没有打勾的时候就会把这个类给删除掉让用户名和密码没办法填写
主要的方法
$("#findform li .inputext").removeClass("grayinput");删除类，不能填写$("#findform li .inputext").addClass("grayinput");点击以后添加这个类，变得可以填写
<!DOCTYPE htm><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /><script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script></head><body><style type="text/css">*{margin:0;margin:0;list-style-type:none;}a,img{border:0;}img{vertical-align:middle;}label{cursor:pointer;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:normal;font-weight:normal}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit}input,button,textarea,select{*font-size:100%}body{font:12px/180% Arial,"宋体";color:#333;}.formbox{width:400px;border:solid 1px #ddd;padding:10px 20px 20px 20px;margin:0 auto;}.findfive{height:20px;overflow:hidden;padding:5px 0 0 20px;}/* findform */#findform{padding:0 0 0 20px;}#findform li .inputext{width:360px;height:20px;line-height:20px;padding:0 0 0 3px;background:url(images/inputbg.png) no-repeat;border:solid 1px #c6c6c6;}#findform li .inputext input{border:none;font-family:Arial;background:none;width:97%;margin:3px 0 0 0;}#findform li .grayinput{background:url(images/inputgraybg.png) no-repeat;}</style><div name="" id="five" /> <label for="five">点击填写内容信息</label></div><ul id="findform" name="" value="" id="" disabled="disabled" /></div></li><li><span name="" value="" id="" disabled="disabled" /></div></li><li><span name="" value="" id="" disabled="disabled" /></div></li></ul></div><!--formbox end--><script type="text/javascript">$(document).ready(function(){//定义一个可以激活所有函数的方法$("#five").click(function(){//定义一个点击事件if($(this).attr("checked")){//如果改变图像的 width 属性 checked 属性设置或返回 checkbox 是否应被选中$("#findform li input").removeAttr("disabled","");//定义一个 从 findform li input 里面删除 disabled $("#findform li .inputext").removeClass("grayinput");//定义 在从 findform li .inputext里面删除掉 grayinput 类}else{//否则$("#findform li input").attr("disabled","disabled");//findform li input 改变图片的 width 属性 disabled$("#findform li .inputext").addClass("grayinput");//在findform li .inputext里面添加一个grayinput类}})});</script></body></html>