点击手风琴箭头后整段div消失，如何仅实现内容折叠展开效果？

• 错误1：代码中$("#"+id_).slideToggle( "slow" )选中的是外层包含标题、箭头、内容的整个.accr-button容器，调用slideToggle会直接把整段容器隐藏，就是你遇到的整段div消失的问题。
• 错误2：$('.table-container').toggle( "slow" )会选中页面所有手风琴的内容区域，点击任意箭头会同时切换所有内容的显隐，不符合手风琴单个操作的预期。

把原有JS逻辑替换为以下代码即可：

$(document).ready(function() {
    $(document).on('click','.picto-accr', function (e) {
        // 切换箭头旋转状态
        $(this).toggleClass('picto-open');
        // 仅切换当前箭头所属手风琴的内容区域
        $(this).siblings('.table-container').slideToggle( "slow" );
    });
});

• 移除了错误的外层容器slideToggle逻辑，不会再把整段div隐藏
• 用siblings('.table-container')选中当前箭头同级的内容区域，只会操作当前点击的手风琴的内容，不会影响其他手风琴
• 保留了原有的箭头旋转动画和内容滑入滑出效果，符合预期交互
• 如果需要保留原有的data-arcid绑定逻辑，也可以把内容切换行替换为$("#"+id_).find('.table-container').slideToggle("slow")，效果一致。

内容的提问来源于stack exchange，提问作者Benjamin Hutchinson