style 中visibility和display之间的区别

最新推荐文章于 2022-04-18 17:23:51 发布

红尘007

最新推荐文章于 2022-04-18 17:23:51 发布

阅读量146

点赞数

分类专栏： html

本文链接：https://blog.csdn.net/weixin_37933545/article/details/102457736

版权

html 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

visibility：
visible 可见
display：
在这里插入图片描述
HTML 代码：

 			<tr id="water_title" style="visibility: collapse;">
                <td width="13%" height="25" bgcolor="#FFFFFF"><strong>标题</strong></td>
                <td width="87%" bgcolor="#FFFFFF"><input name="title" type="text" id="title" value="<?=$result[0]['title']?>" size="100" maxlength="100" /></td>
            </tr>

JQ 代码：

<script type="text/javascript">
    $(document).ready(function(){
        function init(){
            var value = $("#type option:selected").val();
            var trl = document.getElementById("water_title");
            if (value == 1){
                trl.style.visibility = 'collapse';
            }else{
                trl.style.visibility = 'visible';
            }
        }
        init();
    })
    $("#type").change(function(){
        var value = $("#type option:selected").val();
        var trl = document.getElementById("water_title");
        if (value == 1){
            trl.style.visibility = 'collapse';
        }else{
            trl.style.visibility = 'visible';
        }
    })
</script>