相关疑难解决方法(0)

我有一个弹出窗口,在内部点击时消失,但我的目的是让它在外面点击时消失.

目前弹出窗口工作正常,但只要我在窗口内单击就会消失.当我在窗外点击时,它会停留.我如何让它以无人问津的方式运作？

代码为:

function deselect(e) {
  $('.pop').slideFadeToggle(function() {
    e.removeClass('selected');
  });    
}

$(function() {
  $('.invite_room_btn').on('click', function() {
    if($(this).hasClass('selected')) {
      deselect($(this));               
    } else {
      $(this).addClass('selected');
      $('.pop').slideFadeToggle();
    }
    return false;
  });

  $('.close').on('click', function() {
    deselect($('.invite_room_btn'));
    return false;
  });
});

$.fn.slideFadeToggle = function(easing, callback) {
  return this.animate({ opacity: 'toggle', height: 'toggle' }, 'fast', easing, callback);
};

HTML是:

<span class="invite_room_btn">
            <div class="messagepop pop">
            </div>
</span>

谢谢!

我最近和最近的一些问题都没有收到,所以我想提一下你应该善待.其他一些人甚至没有明显的理由投票我的问题,没有任何评论表明他们的推理.我不喜欢这样,因为它让我有被阻止的风险.是的,我知道我的一些帖子并不是最经常考虑的,但是人们往往会对我一直在我面前的一个简单错误作出​​反应.现在,关于这个问题.

TL; DR:善待!

我有一个设置div:

<div id="settings">
    <p><a href="settings.php" class="settings">Search Settings</a></p>
    <p><a href="sync.php" class="settings">Sync Settings</a></p>
    <p><a href="anon.php" class="settings">Go Anonymous</a></p>
</div>

为了打开这个div,我有一个按钮:

<a onClick="openSettings()" href="#" class="footer" id="settings-button">Settings</a>

为了让按钮打开div,我有一些简单的JavaScript:

$("html").click(function(){
    $("#settings").slideUp()
});

$("#settings").click(function(e){
    e.stopPropagation();
});

function openSettings() {
    $("#settings").slideDown();
}

现在,出于任何原因,当我点击按钮时,它会打开div并再次关闭它.我发现这非常奇特.此时,我不知道该怎么做.我已经阅读了两个成功回答的Stack Overflow问题,我甚至尝试复制并粘贴确切的代码而没有结果.

这些文章在这里:

jQuery:如果在别处检测到点击,则隐藏弹出窗口

当我点击外面时如何让这个弹出框消失？

我在这一点上非常困惑,我不知道该怎么做.非常感谢任何帮助.

最诚挚的问候,伊曼纽尔

编辑:好的.似乎我忘了包含我的CSS样式,所以这里是:

div#settings {
display: none;
position: absolute;
right: 20px;
bottom: 50px;
background-color: #9E9E9E;
width: 200px;
box-shadow: 2px 2px 10px #000000;
border-style: solid;
border-color: #000000;
border-width: 1px;
color: #551A8B;
padding-left: 15px;
}