Javascript:Onload if if复选框,更改li类

时间:2010-05-12 14:39:39

标签: javascript html checkbox onload

我在javascript端有这个代码:

function changeSelectionStyle(id) {
    if(document.getElementById(id).className != 'yes'){
    document.getElementById(id).className = 'yes';
    }
    else{document.getElementById(id).className = '';}
}

这是关于HTML:

<ul>
  <li id="selectedAuthorities-4_1li" class="">
    <input type="checkbox" id="selectedAuthorities-4_1" name="selectedAuthorities" value="ROLE_ADD_COMMENT_TO_CV" checked="checked" onload="changeSelectionStyle(this.id + 'li');" onclick="changeSelectionStyle(this.id + 'li'); checkFatherSelection(this.id);">

    <a href="#" onclick="document.getElementById('selectedAuthorities-4_1').click(); return false;">  Agregar comentario <samp><b></b>Permite agregar comentario en el detalle.</samp>
    </a>
 </li> 

那么我无法得到的工作是当选中复选框时,加载时,JS应该检查它,并将class="yes“分配给li,这里:<li id="selectedAuthorities-4_1li" class="">

我应该在原始JS函数中添加什么才能实现这一点。请注意,li id不是静态的,它们是动态的,生成html li id。

解决方案的过程(逻辑):

加载事件时,检查是否选中了带有X id的输入,如果是,则使用JS函数changeSelectionStyle更新父li。因为我现在遇到的问题是,当我选择一个输入(检查它)时,li颜色正在切换,但是当它加载选择/检查输入时,颜色保持不变,并且当我改变颜色时单击输入(取消选中 - 错误的效果)

1 个答案:

答案 0 :(得分:0)

window.onload=function(){
var inputFields=document.getElementsByTagName('input');
var checkBoxes[];
for(var i=0;i<inputFields.length;i++)
 if(inputFields[i].type=='checkbox'&&inputFields[i].checked=='checked'&& inputFields[i].parentNode.tagName=='LI')
inputFields[i].parentNode.className='yes';
}

我们走了..