jQuery Isotope和Twitter Bootstraps nav nav-pills

Question

我是一個JavaScript語言的完整新手。

我跟着this使用同位素教程。我決定嘗試將這個與nav-pills結合起來創建我自己的過濾器。它很好地工作，但是當我點擊我的過濾器後，菜單彈出不會消失。

我的代碼，請參閱片段：

  <ul class="nav nav-pills"> 

       <li id="isotopedemo"><a href="" data-filter="*">Demo All</a></li> 

       <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" class="menu">For Sale<b class="caret"></b></a> 
        <ul class="dropdown-menu"> 
         <li id="isotope"><a href="" data-filter=".cat1">Demo 1</a></li> 
         <li id="isotopedemo"><a href="" data-filter=".cat2">Demo 2</a></li> 
         <li id="isotopedemo"><a href="" data-filter=".cat3">Demo 3</a></li> 
         <li id="isotopedemo"><a href="" data-filter=".cat4">Demo 4</a></li> 
         <li id="isotopedemo"><a href="" data-filter=".cat5">Demo 5</a></li> 
         <li id="isotopedemo"><a href="" data-filter=".cat6">Demo 6</a></li> 
        </ul> 
       </li> 

      </ul> 



<script type="text/javascript"> 
    $(document).ready(function(){ 
    var $container = $('#content'); 
    $container.isotope({ 
     filter: '*', 
     animationOptions: { 
     duration: 750, 
     easing: 'linear', 
     queue: false, 
     } 
    }); 

    $('#isotopedemo a').click(function(){ 
     var selector = $(this).attr('data-filter'); 
     $container.isotope({ 
     filter: selector, 
     animationOptions: { 
     duration: 750, 
     easing: 'linear', 
     queue: false, 

     } 
     }); 
     return false; 
    }); 
    }); 
</script> 

我只想框關閉其一次點擊，是什麼使這更令人沮喪的是，我不知道該怎麼尋找。

Answer 1

試試這個

現場演示：http://codebins.com/bin/4ldqp7z

$(document).ready(function() { 
    var $container = $('#content'); 
    $container.isotope({ 
     filter: '*', 
     animationOptions: { 
      duration: 750, 
      easing: 'linear', 
      queue: false, 
     } 
    }); 


    $(".dropdown").click(function(){ 
     $(".dropdown-menu").show(400); 
    }); 
    $('#isotopedemo a').click(function() { 
     var selector = $(this).attr('data-filter'); 
     $container.isotope({ 
      filter: selector, 
      animationOptions: { 
       duration: 750, 
       easing: 'linear', 
       queue: false, 

      } 
     }); 

     $(".dropdown-menu").hide(500); 
     return false; 
    }); 
});