點擊空白區域返回到選定區域

Question

<li class="list "><a href="javascript:">A</a> 

    <ul class="names"> 
     <li class="list"><a href="javascript:">1</a> 
     </li> 
     <li class="list"><a href="javascript:">2</a> 
     </li> 
    </ul> 
</li> 
<li class="list "><a href="javascript:">B</a> 

    <ul class="names selected"> 
     <li class="list selected"><a href="javascript:">1</a> 
     </li> 
     <li class="list"><a href="javascript:">2</a> 
     </li> 
     <li class="list"><a href="javascript:">3</a> 
     </li> 
     <li class="list"><a href="javascript:">4</a> 
     </li> 
    </ul> 
</li> 
<li class="list "><a href="javascript:">C</a> 

    <ul class="names"> 
     <li class="list"><a href="javascript:">1</a> 
     </li> 
     <li class="list"><a href="javascript:">2</a> 
     </li> 
     <li class="list"><a href="javascript:">3</a> 
     </li> 
     <li class="list"><a href="javascript:">4</a> 
     </li> 
    </ul> 
</li> 

    $('.list').click(function() { 
     var that = this; 
     $('.list').each(function() { 
      if (that == this) return true; //continue 
      $('.names:not(:hidden)', this).slideToggle(); 
     }); 
     $('ul.names', this).slideToggle(); 
    }) 
ul.names{display: none;} 
li.list{ 
    width:150px; 
     background:#A9FF7A; 
} 
ul.names { 
    width:150px; 
    background:#A9FF7A; 
} 
ul.selected{ 
    display: block; 
} 
li.selected{ 
    background:red; 
} 

在線樣本：http://jsfiddle.net/gyYyd/

乙的子菜單高亮顯示。如果我點擊菜單A或C，然後A或C部分會打開，但是如何單擊PAGE BLANK區域（背景顏色之外）返回B部分（打開B部分）

謝謝提前

Answer 1

您可以在document對象上捕獲click s並觸發所需列表項上的click。

$(document).click(function() { 
    var selected = $('.selected:first'); 
    if(!selected.closest('ul.names').is(':visible')) { 
     selected.closest('.list').trigger('click'); 
    } 
}); 

此外，請務必return false從當前列表項click處理程序 - 這樣的列表項目正常點擊不傳播到上面的處理程序。

DEMO：http://jsfiddle.net/gyYyd/2/