jQuery對空白部分的手風琴控制

Question

我有一個使用ui主題設計風格的jQuery手風琴。我的問題是，如何獲得一個沒有子部分的部分，並且在鼠標移動時不會展開？我使用鼠標懸停作爲我的觸發器。

例如：

的主頁部分沒有任何在它之下。我希望它在盤旋時保持崩潰狀態。點擊時，它應該導航到href目標（它所做的）。

初始化代碼：

<script type="text/javascript"> 
    $(function() { 
     $("#accordion").accordion({ 
      event: "mouseover", 
      alwaysOpen: false, 
      autoHeight: false, 
      navigation: true, 
     }); 
    }); 
</script> 

標記（縮短爲了簡潔）：

<div id="accordion"> 
    <h3><a class="heading" href="~/Home">Home</a></h3> 
    <div> 
    </div> 
    <h3><a href="#">Browse</a></h3> 
    <div> 
     <li><a href="http://www.php.net/">PHP</a></li> 
     <li><a href="http://www.ruby-lang.org/en/">Ruby</a></li> 
     <li><a href="http://www.python.org/">Python</a></li> 
     <li><a href="http://www.perl.org/">PERL</a></li> 
     <li><a href="http://java.sun.com/">Java</a></li> 
     <li><a href="http://en.wikipedia.org/wiki/C_Sharp">C#</a></li> 
    </div> 
</div> 

樣式表是直從jQuery UI主題庫。

預先感謝您。

裏克

Answer 1

我做了一些更改以使其正常工作，主要是在主標頭中添加一個標識並collapsible: true到手風琴。

然後，創建你的手風琴後添加這些：

$('#home').unbind('mouseover');//don't accordion on mouse over 
$('#accordion').accordion('activate', 0);//close the home accordion 

有關工作例如，在這裏看到：http://jsfiddle.net/ryleyb/mywfV/

Answer 2

你可以一個事件處理程序綁定到change事件手風琴：http://jqueryui.com/demos/accordion/#event-change。當它觸發時，檢查Home標頭，如果它是選中的標題，請使用activate方法關閉它：http://jqueryui.com/demos/accordion/#method-activate