作者:zccst
需求:用户点击checkbox时,如果选择,则让其子类型checkbox变成灰色。
如果取消选择,再让子类型checkbox变成正常可选状态。
分析:用到知识点
1,选择器。找到目标dom节点
2,如何判断是目标标签
3,找到目标标签后,
如果选择,则设置子类型属性disabled为true
如果不选择,则设置子类型属性disabled为false
需求:用户点击checkbox时,如果选择,则让其子类型checkbox变成灰色。
如果取消选择,再让子类型checkbox变成正常可选状态。
分析:用到知识点
1,选择器。找到目标dom节点
2,如何判断是目标标签
3,找到目标标签后,
如果选择,则设置子类型属性disabled为true
如果不选择,则设置子类型属性disabled为false
function change_item(checkbox_obj)
{
//用户勾选后,对应的子类型,叶子都变为不可选;取消勾选后,子类型和叶子又变得可选
var _ancestors = $(checkbox_obj).ancestors();
var _parent = _ancestors[0];
var _childs = [];
if($(_parent).next()){
var _obj_td = $(_parent).next();
_childs = $(_obj_td).descendants();//descendants()后代,childElements()直接孩子;
}
if(checkbox_obj.checked == true){
//置为只读
for(var index in _childs){
if(_childs.hasOwnProperty(index)){
if($(_childs[index]).hasAttribute('type')){
$(_childs[index]).writeAttribute("disabled", true);
}
}
}
}else if(checkbox_obj.checked == false){
//置为可选
for(var index in _childs){
if(_childs.hasOwnProperty(index)){
if($(_childs[index]).hasAttribute('type')){
$(_childs[index]).writeAttribute("disabled", false);
}
}
}
}
}
<input type="checkbox" onclick="change_item(this);" value="苹果" />苹果