jQuery 手风琴在更改时填充 Table

Question

我有一个页面，上面有几个手风琴选项卡和大量数据。当用户更改选项卡时，我想触发一个填充我的表的函数。我目前在加载时填充所有内容，这非常缓慢且效率低下。我尝试了以下方法：

$( "#accordion" ).accordion({ beforeActivate: popdata }); - Activates only once.
$( "#accordion" ).accordion({ activate: popdata }); - Acts as a click.
$( "#accordion" ).change() - Depricated
$( "#accordion" ).click(); - Acts as a click.
$( "#accordion" ).header(); - Not Applicable
$( "#accordion" ).trigger(); - Acts as a click.
$( "#accordion" ).click( function ( event ) { event.currentTarget }; - Only lists the div.
$( "#accordion" ).bind('accordionchange', yourFunction); - Depricated

click 和 activate 事件在用户单击手风琴上的任意位置时触发。我需要将其限制为 headers 或制表符，但找不到这样做的代码。 beforeActivate 只触发一次。

有人能提出建议吗？我曾尝试创建自己的活动。有没有办法过滤点击事件以确定用户是否点击了ui-accordion-header?

Answer 1

我承认在 jQuery 方面我是 "old school"，但我发现简单的解决方案是最好的。

$(document).ready(function($) {
  $('#accordion').find('.accordion-toggle').click(function() {
    // Expand or collapse this panel
    $(this).next().slideToggle('fast');

    // Hide the other panels
    $(".accordion-content").not($(this).next()).slideUp('fast');
  });
});

万分感谢simple accordion solution with jQuery

Answer 2

所以诀窍是输入类。 TY MrPickles 的提示。我可以按如下方式动态更新表格：

$( ".accordion" ).click(function() {  }

accordion，ui-accordion，ui-accordion-header，ui-accordion-header-active，ui-accordion-header-collapsed，ui-accordion-content, ui-accordion-content-active 都不错类.

参考主题：https://api.jqueryui.com/accordion/

jQuery 手风琴在更改时填充 Table

jQuery Accordion Populate Table on Change

jquery

jquery-ui-accordion