一个ID为take_shop_id的input当点击input 框时会弹出一个层这个层ID为my_shop怎样可以实现点击除了take_shop_id和my_shop外的任何地方,隐藏掉 my_shop这个层呢

解决方案 »

  1.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    </head><body>
    <input id="take_shop_id" type="button" value="22222222222222" />
    <div id="my_shop" style="display:none; background:#CCCCCC; height:200px"><p>无标题文档无标题文档</p></div>
    <div style="background-color:#EEE">无标题文档</div>
    <div style="background-color:#999">无标题文档</div>
    <div style="background-color:#EEE">无标题文档</div>
    <div style="background-color:#999">无标题文档</div>
    <div style="background-color:#EEE">无标题文档</div>
    <div style="background-color:#999">无标题文档</div>
    <div style="background-color:#EEE">无标题文档</div>
    <div style="background-color:#999">无标题文档</div>
    <div style="background-color:#EEE">无标题文档</div>
    <div style="background-color:#999">无标题文档</div>
    <script type="text/javascript">
    //<![CDATA[
    $(function(){
    $('#take_shop_id').click(function(){
    $('#my_shop').show();
    $('body').one('click',function(){
    $('#my_shop').hide();
    });
    return false;
    });
    $('#my_shop').click(function(){
    return false;
    });
    })
    //]]>
    </script>
    </body>
    </html>
      

  2.   


    $("#take_shop_id").click(function(){
         $("#id").show();//层的id暂时设置为id
    });
    $("body").click(function(){
         $("#id").hide();
    })
     $('#my_shop').click(function(){
            return false;
        });