jQuery身体点击问题

我有一个div，我想隐藏点击它之外。jQuery身体点击问题

它几乎可以工作，除了按钮类每两次只更改一次。

我点击按钮，添加活动按钮类，下拉滑落，我点击下拉外的某个地方，它向上滑动，按钮类返回到原始状态。但是，当我重复这一点时，不添加按钮类“isActive”。

这里的功能：

function toggleSelectGroupList(){ 
    $('#groupListSortby').slideToggle(30); 


    $('body').click(function(){ 
     $('#groupListSortby').click(function(e) { e.stopPropagation(); }) 
     $('#groupListSortby').hide(); 
     $('.sortFriends .btngrey .gfx').toggleClass('isActive'); 
     $('.sortFriends .btngrey a').toggleClass('isActive'); 
    }); 
}

标记：

<div class="sortFriends"> 

<div class="btngrey"> 
    <span class="gfx"></span> 
    <a onClick="toggleSelectGroupList()">All friends</a> 
</div> 

<div class="dropdownList" id="groupListSortby"> 
    <ul> 
     <li class="isActive"> 
      <span class="gfx"></span> 
      <a href="#">All friends</a> 
     </li> 
     <li> 
      <a href="#">Recently added</a> 
     </li> 
     <li class="last"> 
      <a href="#">The Railers</a> 
     </li> 
    </ul> 
</div> 

</div>

来源

2010-11-09 Johan Wallberg

你应该从一开始就绑定你click处理程序和传播停止，应立即势必为好，这样的整体：

$(function() { 
    $(".sortFriends .btngrey a").click(function(e) { 
    $('#groupListSortby').slideToggle(30); 
    $('.sortFriends .btngrey .gfx, .sortFriends .btngrey a').toggleClass('isActive'); 
    e.stopPropagation(); 
    }); 
    $('#groupListSortby').click(function(e) { 
    e.stopPropagation(); 
    }); 
    $('body').click(function(){ 
    $('#groupListSortby').hide(); 
    $('.sortFriends .btngrey .gfx, .sortFriends .btngrey a').removeClass('isActive'); 
    }); 
});

一致，您应该<a>没有一个onclick内嵌本不过，这只会这样做：

<div class="btngrey"> 
    <span class="gfx"></span> 
    <a href="#">All friends</a> 
</div>

You can test it out here。

来源

2010-11-09 10:52:36

它的工作原理！一个问题，虽然，我有一个输入字段，并点击它时，div不滑动？ – 2010-11-09 14:42:58

@Johan - 我没有跟随，''字段在哪里？（并且* id *有一个'return false'或'stopPropagation（）一路上？） – 2010-11-09 14:52:30

你能张贴的HTML代码？这可能是你隐藏了比你想要的更多的元素。或者为什么你有这么多的选择器：'.sortFriends .btngrey .gfx'

来源

2010-11-09 10:14:15 Simon

这个问题可能是你将点击处理程序附加到另一个点击事件的正文中，并且在你正在附加另一个事件的正文单击事件中。每次点击都会发生这种情况。你确定要这么做吗？尝试在$（window）.load中附加事件。

来源

2010-11-09 10:28:48 rbhro

删除从toggleSelectGroupList函数的函数，并在$把（文件）。就绪（函数（） ...

$('body').click(function(){ 
    $('#groupListSortby').click(function(e) { e.stopPropagation(); }) 
    $('#groupListSortby').hide(); 
    $('.sortFriends .btngrey .gfx').toggleClass('isActive'); 
    $('.sortFriends .btngrey a').toggleClass('isActive'); 
});

来源

2010-11-09 10:56:04 Itamar

jQuery身体点击问题

回答

相关问题