Divi主题WordPress站点同页多区块手风琴全局互斥关闭求助

• 类选择器遗漏.符号：$('et_pb_toggle_title') 是无效选择器，类选择器必须添加.前缀，正确写法为$('.et_pb_toggle_title')
• 选择范围逻辑错误：prevAll()和nextAll()只能选中当前元素同一父级下的兄弟元素，无法匹配页面中其他手风琴区块的手风琴项，无法实现全局互斥
• 排除逻辑错误：第一行代码中用not($this)（$this是标题元素）和手风琴项父元素做匹配，完全无法排除当前点击的手风琴项，会导致点击后当前项也被关闭

jQuery(function($){
    // 监听所有手风琴标题的点击事件
    $('.et_pb_toggle_title').on('click', function() {
        // 获取当前点击标题所属的手风琴项
        const $currentToggle = $(this).closest('.et_pb_toggle');
        // 选中页面中所有不是当前项的已打开手风琴项
        $('.et_pb_toggle_open').not($currentToggle).each(function() {
            // 切换为关闭状态：移除打开类，添加关闭类
            $(this).removeClass('et_pb_toggle_open').addClass('et_pb_toggle_close');
            // 同步隐藏内容区域，避免出现类修改后内容仍显示的异常
            $(this).find('.et_pb_toggle_content').hide();
        });
    });
});

使用方式：将上述代码添加到Divi主题选项「集成」选项卡的「 里的代码」或「 前的代码」输入框中保存即可生效。

• 点击手风琴标题时，先通过closest()方法找到当前标题所属的完整手风琴项元素
• 选中页面内所有带有et_pb_toggle_open类的已打开手风琴项，排除当前点击的手风琴项
• 批量将其余已打开的手风琴项修改为关闭状态，同时同步隐藏内容区域，兼容Divi原生的交互逻辑

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