關閉切換div頁面上的任何地方，除了切換內容

我很努力與我切換的div，我擁有的一切工作正常，當我點擊與#togglesearch的id鏈接，但我想要的是能夠關閉已切換的可見div，當我單擊頁面上除切換的div之外的任何地方時。關閉切換div頁面上的任何地方，除了切換內容

這是我的時刻：

<script type="text/javascript"> 
jQuery(document).ready(function($){ 

jQuery('#togglesearch').click(function() { 
     jQuery('.toggle-search').slideToggle('fast'); 
     return false; 
    }); 
}); 
</script>

和HTML很簡單：

<a href="#" id="togglesearch">Slide Toggle</a> 

<div class="toggle-search" style="display:none;"> 
<ul> 
<li><a href="#">Link One</a></li> 
<li><a href="#">Link Two</a></li> 
<li><a href="#">Link Three</a></li> 
</ul> 
</div><!-- end toggle content -->

的.toggle搜索是被切換的股利，但我不希望它關閉，如果我點擊該div，只是在頁面上的其他地方。

謝謝。

來源

2014-09-18 Duggy G

你將需要發佈你的HTML以及。 – j08691 2014-09-18 16:00:35

這是一個我認爲重複的問題。 http://stackoverflow.com/questions/1403615/use-jquery-to-hide-a-div-when-the-user-clicks-outside-of-it – 2014-09-18 16:08:58

對不起，我現在添加了我的HTML使用，謝謝。 – 2014-09-18 19:37:33

給它和id ='toggle-search'並試試這段代碼。

$('body').click(function(evt){  
 
     if(evt.target.id == "toggle-search") { 
 
\t return; 
 
\t }else if(evt.target.id == "togglesearch") { 
 
\t // toggle here 
 
      jQuery('.toggle-search').slideToggle('fast'); 
 
\t } else { 
 
      jQuery('.toggle-search').slideUp('fast'); 
 
} 
 
});

來源

2014-09-18 16:06:30

Thankyou的答覆，試過這個，但仍然無法得到它的工作......你說給它一個ID，給一個什麼ID？ – 2014-09-18 19:38:25

oooh，對不起，我忘了解釋得很好，我的想法是這樣的：

....

你可以給它任何你想使用它的id（if（evt.target.id ==「toggle-search」））。 – 2014-09-19 09:35:49

這幾乎是正確的，切換內容正在關閉，當我點擊頁面上的任何地方，除了切換內容，這是我想要的，但現在如果我點擊它打開的頁面上的任何地方並關閉切換區域？感謝您的幫助。 – 2014-09-19 14:11:14

關閉切換div頁面上的任何地方，除了切換內容

回答

相關問題