jQuery的手風琴 - OnCollapse和OnExpand事件

我有一個標題手風琴這樣jQuery的手風琴 - OnCollapse和OnExpand事件

<div class="accordion" id="accordion_acquired_services"> 
    <h3><a href="#">Acquired services</a></h3> 
    <table id="tbl_acquired_services"> 
     <tbody></tbody> 
    </table> 
</div>

我想什麼是綁定在手風琴開放和手風琴接近事件...

其實我想達成的目標是做一個Ajax請求，將在每次擴張時填充手風琴的內容...

奇怪的是沒有onExpand/onCollapse事件

到目前爲止，我有這個

$("#accordion_acquired_services").bind("accordionchange", function(event, ui) { 
    $('#tbl_acquired_services').html(''); 
    //trigger ajax 
});

但觸發兩個場合，當它崩潰，當它展開......我怎麼知道哪個是哪個？

來源

2012-02-15 DS_web_developer

好的，找到它了。我只需要檢查手風琴是否具有活動狀態類。就像這樣：var opened = $（this）.find（'。ui-state-active'）。length; – 2012-02-15 11:38:35

使用changestart事件。見http://jqueryui.com/demos/accordion/#event-changestart – 2012-02-15 11:39:52

請再次閱讀我的問題。問題不在觸發事件時發生，而在打開（展開）或關閉（摺疊）時如何獲取值。我已經知道了;） – 2012-02-15 11:45:50

嘗試這種解決方案：

var opened = $(this).find('.ui-state-active').length;

來源

2012-02-15 11:39:30

可以使用change事件和active選項。像這樣：

$('#accordion').bind('accordionchange', 
    function() { 
     alert('Active tab index: ' + $(this).accordion('option', 'active')) 
    });

來源

2012-02-15 11:47:32

時間變化，所以是jQuery。複製/粘貼從thread

$("#accordion").accordion({ activate: function(event, ui) { 
      alert(ui.newHeader.text()); 
    } 
});

另一個事件：

$("#accordion").accordion({ beforeActivate: function(event, ui) { 
     alert(ui.newHeader.text());   
    } 
    });

take a look at jQuerys docs更多細節

來源

2013-08-18 15:16:37 Toydor

這裏有2碼注意

1.Show 2.Shown 3 。隱藏 4.隱藏

因此，代碼因此，如果我們使用隱藏和顯示手風琴菜單內容關閉後，我們可以觸發或開拓完全

$('#accordion').on('shown.bs.collapse', function() { 
//after menu opens 
}); 

$('#accordion').on('hidden.bs.collapse', function() { 
//after menu closes 
});

來源

2017-05-17 07:02:13 Codebits

尋找這個很長一段時間。謝謝..：） – 2017-09-22 05:16:54

據this SO post，jQuery的沒有按」去下面

$('#accordion').on('show.bs.collapse', function() { 
//on clicking the accordion menu 
}); 

$('#accordion').on('hide.bs.collapse', function() { 
//on clicking the accordion menu 
});

以與上述相同的方式顯示更改。這是我編寫的一個腳本，它與最新的jQuery庫一起工作，它將在打開時獲取手風琴的ID並使用該哈希更新URL。

$(accordionSelText).accordion({ 
     activate: function(event, ui) { 

      var accordionId=ui.newHeader.closest('.accordion').attr('id'); // Grabs the id of the accordion 

      try { 
        if (accordionId) { 
         window.location.hash = accordionId; 
         console.log('Active accordion index: ' + accordionId); 
        } 
      }catch(e){} 
     } 
    });

來源

2017-10-11 12:36:32

jQuery的手風琴 - OnCollapse和OnExpand事件

回答

相關問題