jQuery效果hide() 和 show() 隐藏和显示元素

时间:5年前   阅读:4200

1、hide() 方法隐藏被选元素。

提示:这与 CSS 属性 display:none 类似。

注释:隐藏的元素不会被完全显示(不再影响页面的布局)。

2、show() 方法显示隐藏的被选元素。

注意:show() 适用于通过 jQuery 方法和 CSS 中 display:none 隐藏的元素(不适用于通过 visibility:hidden 隐藏的元素)。

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
    <script type="text/javascript" src="../tu/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" >    
        $(function(){
            $("#gggg").click(function(){
                $("#dddd").hide();
                //语法格式:$(selector).hide(speed,callback);
                //可选参数1:speed 参数规定隐藏/显示的速度,可以取值:"slow"、"fast" 或毫秒。
                //可选参数2:callback 参数是隐藏或显示完成后所执行的函数名称。

                // callback的使用如下,即第2个参数是一个函数,jQuery效果执行完会执行该函数。
                // $("#dddd").hide(3000,function(){
                //      alert("myDiv1隐藏了");
                // });
            });
            
            $("#kkkk").click(function(){
                $("#dddd").show();
                //语法格式:$(selector).show(speed,callback); 
                //可选参数1:speed 参数规定隐藏/显示的速度,可以取值:"slow"、"fast" 或毫秒。
                //可选参数2:callback 参数是隐藏或显示完成后所执行的函数名称。
            });
        });
    </script>
</head>
<body>
    <button type="button" id="gggg">隐藏</button>
    <button type="button" id="kkkk">显示</button>
    <div id="dddd" style="width:100px;height:50px;background-color:darkmagenta"></div>
</body>
</html>

本站声明:网站内容来源于网络,如有侵权,请联系我们https://www.qiquanji.com,我们将及时处理。

微信扫码关注

更新实时通知

上一篇:android的layer-list用法

下一篇:散户没行权的合约钱谁收走了?

网友评论

请先 登录 再评论,若不是会员请先 注册