【jQuery】点击按钮 元素显示 再点击元素以外部分隐藏该元素

1. 点击按钮.phone-download 定位需要显示的元素位置
2. 显示元素#phone-tips
3. 点击空白处或者自身，隐藏元素

$(function(){
            // app下载提示
            $(".phone-download").click(function(event) {
                event.stopPropagation(); 
                // 定位位置
                var pd = $(this).offset();
                $("#phone-tips").css({top: pd.top + 22,left: pd.left - 160});
                //按钮的toggle,如果div是可见的,点击按钮切换为隐藏的;如果是隐藏的,切换为可见的。    
                $('#phone-tips').show(); 
                //点击空白处或者自身隐藏弹出层    
                 $(document).click(function (event) { $('#phone-tips').fadeOut(300) });    
                 $('#phone-tips').click(function (event) {  
                     $(this).fadeOut(300);
                     event.stopPropagation();   
                 });  
            });    
        })

点击空白处关闭弹窗

$(document).mouseup(function(e){
  var _con = $(' 目标区域 ');   // 设置目标区域
  if(!_con.is(e.target) && _con.has(e.target).length === 0){ // Mark 1
    some code...   // 功能代码
  }
});
/*
判断点击事件发生在区域外的条件是：
1. 点击事件的对象不是目标区域本身
2. 事件对象同时也不是目标区域的子元素
*/