0

我当前的代码做什么：我有这个 HTML

 <li>
   <span>Logged in as</span>&nbsp;
   <a class="user" href="#"><?php echo $this->loggedas ?></a>&nbsp;
   <a id="loginarrow" href="javascript: void(0);"></a>
 </li>

这是我上面登录箭头 id 的 JS

 $("#loginarrow").click(function() {
   $("#logindrop").toggle("slow");
   return false;
 });

它工作得很好，但我可以通过再次单击它来关闭它。我不想要所以我想要它，如果它打开并且我点击背景，那么它必须关闭。为此我这样做了

 $("#loginarrow,body").click(function() {
   $("#logindrop").toggle("slow");
   return false;
 });

现在它的工作很酷，但还有另一个问题。

1 = 我在页面（正文）中有许多其他 html 元素，其中还有其他事件要调用。所以在这种情况下，每当我单击页面中的其他元素时，它就会切换我的这个 div 登录箭头。

我想要相同的功能，但不是仅在背景上的其他元素上。任何提示

4

2 回答 2

2

仅在可见时关闭它。

$("body").click(function() { 
   if ($("#logindrop").is(":visible"))
      $("#logindrop").hide("slow");       
});
于 2012-05-11T11:58:51.223 回答
1

良好浏览器性能的基本设计原则是仅在您对事件感兴趣时捕获事件。

因此，将您的.click()处理程序放在#loginarrow元素上，但在该处理程序中注册一个一次性事件处理程序，该处理程序body将再次关闭它。类似（未经测试）：

$('#loginarrow').click(function() {
    $('#logindrop').show('slow');
    $('body').one('click', function() {
        $('#logindrop').hide('slow');
    });
    return false;
});

这将确保您不会不必要地拦截每次点击，body除非您确实需要。

​见http://jsfiddle.net/alnitak/vPHaj/

于 2012-05-11T11:59:06.640 回答