checkbox美化;给div加上checked属性
DIV的背景图修改
$("#isOpenmibao").css("backgroundImage", " url('../images/checkbox_02.png')")
一个是勾选的状态,一个是未勾选的状态, 但是这个不是用 checkbox 来制作的,而是用 DIV配合背景图来制作的
那么我们 提交数据的时候,怎么判断 是勾选还是没勾选呢? 我们给div加上一个 checked属性
<div onclick="myCheckbox('IsOnlyTeacher',this);" id="IsOnlyTeacher" class="checkbox" style="background-image: url("../images/checkbox_02.png");"> </div>
我们来看看这个 myCheckbox 方法 注意里面有一个 o.checked 这就是人为的给div层 加了一个 checked属性
//设置单选框处理 function myCheckbox(obj, thisobj) { var o = document.getElementById(obj); //解决复选框需要连续点击两次才生效的bug by yxx,此处做特殊处理 if (thisobj.style.backgroundImage == 'url("../images/checkbox_02.png")') { thisobj.style.backgroundImage = "url(../images/checkbox_01.png)"; o.checked = false; } else { if (o.checked) { thisobj.style.backgroundImage = "url(../images/checkbox_01.png)"; o.checked = false; } else { thisobj.style.backgroundImage = "url(../images/checkbox_02.png)"; o.checked = true; } } }
假如我们点击了任何一个的div,就会触发上面的函数,那么对应的div就会增加checked属性. 下面就是在我们的提交的方法里面 直接对DIV判断有没有checked 即可
var isonlyteacher = $("#IsOnlyTeacher").attr("checked");
如果我们不是对div点击 ,还是直接显示后提交,这里就需要我们先人为的给div加一个checked属性了 ,这个自己搞一下即可