ZK 通过checkbox 控制div的显示与隐藏

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_40646143/article/details/85282844

实现的效果

        

  • 通过点击checkbox 动态显示下面div的显示与隐藏

html的代码

    <input type="checkbox" id="check"/>

               <div class="form-group" id="tbox" style="display: none;">
                     <label class="col-lg-2 control-label">
                        显示或隐藏的内容 </label>
                             <div class="col-lg-10">
                                <input id="color" type="color" value="${vm.roleColor}"/>
                            </div>
                 </div>

js代码为

   $(document).ready(function() {
            $('#check').click(function(){
            if($("#tbox").css('display')=='none'){
            $("#tbox").css("display","block");
            }else{
            $("#tbox").css("display","none");
            }
            })
            });

这样就实现了div的隐藏的显示 首次进入页面这个div是隐藏的

style="display: none; 这段代码不能丢

猜你喜欢

转载自blog.csdn.net/qq_40646143/article/details/85282844
zk