<script type="text/javascript">
function myFunction() {
if (document.getElementById("ChkChildIssue").checked)
{
document.getElementById("dhamale").style.display="none";
document.getElementById("sachin").style.display="block";
}
else
{
document.getElementById("dhamale").style.display="block";
document.getElementById("sachin").style.display="none";
}
}
</script>
<body>
<input type="Checkbox" name="ChkChildIssuess" id="ChkChildIssue" onclick="myFunction();" />Include Child issue</br>
<div id="dhamale" > </div>
<div id="sachin" style="display:none;" > </div> // i want this div by default diaplay
选中复选框后，div“ dhamale”将被隐藏，div“ sachin”将被显示，反之亦然。
但是，当复选框被选中的时间，div“ sachin”不会显示。
(document.getElementById("sachin").style.display="block" //this is not working
您的代码应该可以工作。但是为什么要使用JavaScript？您可以使用CSS完美解决此问题。
<div class="toggle-wrapper">
<input type="checkbox" name="toggler"/>Toggler
<div class="content">
<div class="active">This is the active box</div>
<div class="inactive">This is the inactive box</div>
</div>
</div>
.content {
position: relative;
overflow: hidden;
width: 300px;
height: 100px;
}
.content > div {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #dfdfdf;
}
input[type="checkbox"]:checked + .content .active {
z-index: 1;
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句