当使用jQuery / Java单击复选框时,我需要显示div。 “已检查”来自数据库,因此我还需要检查是否已在页面加载时选中该复选框。
这就是我目前的情况:
<input type="checkbox" name="foo" value="1" onclick="$(this).is(':checked') && $('#checked-a').slideDown('slow') || $('#checked-a').slideUp('slow');"/>
<div class="dis-sub" style="display: none;" id="checked-a">
...
</div>
代码按原样显示/隐藏div。我需要一个检查页面加载的解决方案,看看是否已经选中了复选框(在这种情况下是动态的,来自数据库的PHP)。
提前致谢。
答案 0 :(得分:4)
我想从HTML标记中删除onclick javascript调用并放入脚本文件中。这使代码更清晰。
当您选中复选框时,这将更改可见性。(假设复选框的ID为“foo”)
$("#foo").change(function(){
var ischecked=$(this).is(':checked');
if(ischecked)
{
$("#checked-a").fadeIn(200);
}
else
{
$("#checked-a").fadeOut(200);
}
});
如果要检查数据库中的值并更改可见性,可以在html中设置已检查的属性值(使用从数据库中获取的PHP变量值),然后检查复选框的已检查属性的值并改变可见性
<强> HTML 强>
<input type="checkbox" id="foo" value="1" checked="checked"/>
<div style="display:none;" id="checked-a">
Some content
</div>
<强>的Javascript 强>
$(function(){
var ischecked=$("#foo").is(':checked');
if(ischecked)
{
$("#checked-a").fadeIn(200);
}
else
{
$("#checked-a").fadeOut(200);
}
});
答案 1 :(得分:1)
<script type="text/javascript">
$(function(){
if($('input[name = "foo"]').is(':checked'))
$('#checked-a').slideDown('slow');
});
</script>
请注意,此代码将在文档就绪
上执行答案 2 :(得分:1)
做这样的事情:
$("#foo").click(function() {
$('#checked-a')[$(this).prop('checked')?'slideDown':'slideUp']('slow');
}).triggerHandler('click');
答案 3 :(得分:0)
if($('input:checkbox').prop('checked')) {
//checkbox is checked, do stuff
}