Javascript 初始关闭第一个切换开关

我正在努力更改JS/PHP，以确保在页面首次加载时关闭第一个切换

以下是控制切换的PHP：

            function wave_shortcode_accordion($attr, $content = null) {


            $attr = shortcode_atts(array(
                'style'           => "default",
                'animation'       => "",
                'animation_time'  => 1500,
                'animation_delay' => 0
            ), $attr);

            if (!empty($attr['animation'])) {
                $attr_animation = '';
                $attr_animation .= ' data-animation="' . $attr['animation'] . '"';
                $attr_animation .= ' data-animation-time="' . $attr['animation_time'] . '"';
                $attr_animation .= ' data-animation-delay="' . $attr['animation_delay'] . '"';
            } else {
                $attr_animation = '';
            }

            $html = '<div class="toggles single ' . $attr['style'] . '"' . $attr_animation . '>' . do_shortcode($content) . '</div>';

            return $html;
        }

        function wave_shortcode_toggles($attr, $content = null) {

            $attr = shortcode_atts(array(
                'style'           => "default",
                'animation'       => "",
                'animation_time'  => 1500,
                'animation_delay' => 0
            ), $attr);

            if (!empty($attr['animation'])) {
                $attr_animation = '';
                $attr_animation .= ' data-animation="' . $attr['animation'] . '"';
                $attr_animation .= ' data-animation-time="' . $attr['animation_time'] . '"';
                $attr_animation .= ' data-animation-delay="' . $attr['animation_delay'] . '"';
            } else {
                $attr_animation = '';
            }

            $html = '<div class="toggles multi ' . $attr['style'] . '"' . $attr_animation . '>' . do_shortcode($content) . '</div>';

            return $html;
        }

        function wave_shortcode_toggle($attr, $content = null) {

            $attr = shortcode_atts(array(
                'title'  => "",
                'status' => ""
            ), $attr);

            $status = "";

            if ($attr['status'] == "open") {
                $status = "active";
            } elseif($attr['status'] == "closed") {
                $status = "inactive";
            }

            $html = '';
            $html .= '<div class="toggle">';
            $html .= '<h3><i class="icon-chevron-right"></i><span>' . $attr['title'] . '</span></h3>';
            $html .= '<div class="toggle-content">';
            $html .= '<div class="toggle-content-inner">' . do_shortcode($content) . '</div>';
            $html .= '</div>';
            $html .= '</div>';

            return $html;
        }

---

任何帮助都将不胜感激！：）

如果您使用的是jquery UI accordion，第一个div将像中一样自动关闭，但不知何故，这不是您的情况。我们可以尝试在页面加载时强制关闭，尝试在jQuery手风琴代码后粘贴以下行：

编辑代码：

jQuery（函数（$）{
jQuery（'div.toggles'）。每个（函数（）{
$（'div.toggle'，$（this））.first（）.find（'h3'）.removeClass（'accordion-header-activeui-state-activeui-corner-top'）.addClass（'ui-corner-all'）.attr（'aria-selected'，false）；
警报（$（'div.toggle'，this.find（'h3'）.attr（'id'））；
$（'div.toggle'，$（this））.first（）.find（'.toggle content'）.removeClass（'accordion-content-active'）.css（'display'，'none'）；
});
});

我对代码进行了一些修改，以满足更多功能：

您的页面上有多个手风琴，此代码将关闭所有手风琴的第一个切换

额外属性

aria selected

已设置为

false

。如果没有此选项，您必须单击第一个切换两次才能打开它

---

如果可能的话，将整个代码与脚本标记一起粘贴到页面的末尾。我让

alert（）

消息显示出来，这将显示三个切换中的

h3

id

（您可以稍后删除这一行）。我保存了它，以便您知道代码是否正在执行。如果

alert（）

框未显示，则表示上述代码未被执行，您应该检查控制台是否有错误或将其放置在其他地方。

您必须取出此

$status

<代码>活动类是切换打开的原因。您好，非常感谢您的快速响应：）我是否删除PHP脚本上的整行内容？我只希望第一个手风琴切换被关闭，我仍然希望切换功能工作，只是不是第一个自动打开。我应该编辑PHP代码的哪一部分（对不起，我仍然在寻找PHP和JS的方法……）：更改

$html.=''至
$html.=''，这可能会使您的所有选项卡保持关闭状态。您好，我尝试了此操作，但在加载时仍保持打开状态。这是开发网站的链接，如果有帮助的话？“扇区”部分的第一个选项卡应关闭。。。[link]）我想我省略了一些代码，所以我编辑了上面的代码。我尝试了一下，但没有成功。第一个切换保持打开状态。谢谢你的帮助：）@user3468079我个人在你的网站上试用了你的代码，效果很好。不知道你把它放在哪里，但我已经把它放在最后了。还可以尝试将上面代码中的
$
替换为
jQuery
@user3468079我喜欢你的判断hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh？在firefox中使用“Firebug”工具，它会显示您的javascript/jquery中是否存在任何错误。您好，我已经尝试过了，但仍然没有成功：（你在Inspector中编辑了哪个文件以获得想要的效果？我现在看到了另一个我甚至不知道的JS文件-jquery.ui.accordion.min.JS-你认为这会覆盖我在这里添加的JS吗？@user3468079请检查上面的编辑，我使用了一个名为
tampermonkey
的工具在你的网站上执行脚本，所以它应该可以工作。）给你。我不做自由职业者的工作，因为我还是个初学者，但你可以在
 $('.toggles.multi').accordion({
    header: "h3",
    active: false,
    collapsible: true,
    beforeActivate: function (event, ui) {
        if (ui.newHeader[0]) {
            var currHeader = ui.newHeader;
            var currContent = currHeader.next('.ui-accordion-content');
        } else {
            var currHeader = ui.oldHeader;
            var currContent = currHeader.next('.ui-accordion-content');
        }

        var isPanelSelected = currHeader.attr('aria-selected') == 'true';
        currHeader.toggleClass('ui-corner-all', isPanelSelected).toggleClass('accordion-header-active ui-state-active ui-corner-top', !isPanelSelected).attr('aria-selected', ((!isPanelSelected).toString()));
        currHeader.children('.ui-icon').toggleClass('ui-icon-triangle-1-e', isPanelSelected).toggleClass('ui-icon-triangle-1-s', !isPanelSelected);
        currContent.toggleClass('accordion-content-active', !isPanelSelected)

        if (isPanelSelected) {
            currContent.slideUp();
        } else {
            currContent.slideDown();
        }

        return false;
    }
});

<script>
jQuery(function($){
    jQuery('div.toggles').each(function() {
       $('div.toggle',$(this)).first().find('h3').removeClass('accordion-header-active ui-state-active ui-corner-top').addClass('ui-corner-all').attr('aria-selected',false);
        alert( $('div.toggle',this).find('h3').attr('id'));
       $('div.toggle',$(this)).first().find('.toggle-content').removeClass('accordion-content-active').css('display','none');
    });
});
</script>