jQuery点击自身以外地方关闭弹出层-closest()


image image



<html>

<head>

    <meta http-equiv="content-type" content="text/html; charset=utf-8">

    <meta charset="UTF-8">

    <!-- 启用360浏览器的极速模式(webkit) -->

    <meta name="renderer" content="webkit">

    <!-- 避免IE使用兼容模式 -->

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <title>情感问题在线咨询_挽回爱情_挽救婚姻_单身狗情感网,婚恋心理咨询行业门户</title>

    <meta name="Keywords" content="单身狗">

    <meta name="Description" content="婚姻情感咨询,婚恋心理咨询,情感挽回,单身狗情感千名认证情感咨询师在线为感情受挫想要挽回爱情,离婚边缘,婚姻即将破裂想拯救婚姻家庭的你提供专业的情感心理指导,单身狗情感网,中国婚恋情感咨询行业标杆。">

    <link rel="stylesheet" type="text/css" href="css/bootstrap.css">

    <link rel="stylesheet" type="text/css" href="css/ui.css">

    <script src="js/jquery-2.js"></script>

</head>

<body>


<header>

    <div>

        <div>

            <div>愿天下没有难谈的恋爱 - 单身狗</div>

            <div>

                <div id="show" >

                    <p><span><img src="https://www.puamap.com/static/image/yanzhen.png"></span><span >验证官方微信</span><span><img src="https://www.puamap.com/static/image/xiajiantou.png"></span></p>

                    <!--弹窗-->

                    <div id="yc" style="display:none" >

                        <p><input type="text" name="" placeholder="请输入要查询的官方微信号"><span>验证</span></p>

                        <p>你验证的微信号:<span class="">填写微信号</span></p>

                    </div>


                </div>


                <div>

                    <p><span><a  di="dl">登陆</a></span>|<span><a  id="zc">注册</a></span></p>


                </div>


            </div>




            </div>

        </div>



</header>




<script>


    $(function(){

        $(document).bind("click", function (e) {

            if($(e.target).closest("#show").length>0){

                $("#yc").show();

            }else{

                $("#yc").hide();

            }

        });

    });



</script>



</body>

</html>


微信扫码咨询
建站咨询
cache
Processed in 0.009546 Second.