Javascript 多级嵌套手风琴

我想在代码中使用多级切换选项

为此，我使用这个

在该插件中，我没有找到

多级切换

。有谁能帮我用这个插件来使用多级切换

请告诉我这个插件，因为我已经定制了很多。所以如果你推荐一个不同的插件，对我来说会更困难

检查此链接

也检查一下这个。在这篇文章中，他们给出了5个不同的嵌套手风琴演示

下面的代码显示了多级Jquery Accordion

$(document).ready(function() {
//Initialising Accordion
$(".accordion").tabs(".pane", {
    tabs: '> h2',
    effect: 'slide',
    initialIndex: null
});

//The click to hide function
$(".accordion > h2").click(function() {
    if ($(this).hasClass("current") && $(this).next().queue().length === 0) {
        $(this).next().slideUp();
        $(this).removeClass("current");
    } else if (!$(this).hasClass("current") && $(this).next().queue().length === 0) {
        $(this).next().slideDown();
        $(this).addClass("current");
    }
 });
});

---

您尚未将Js和Css文件包含在您的文档中

Css:

Js:

您的js代码：

jQuery(document).ready(function ($) {
        $(".accordion_example1").smk_Accordion();
        $(".accordion_example2").smk_Accordion({
            closeAble: true,
        });
        $(".accordion_example3").smk_Accordion({
            showIcon: false,
        });
        $(".accordion_example4").smk_Accordion({
            closeAble: true,
            closeOther: false,
        });
        $(".accordion_example5").smk_Accordion({
            closeAble: true
        });
        $(".accordion_example6").smk_Accordion();
        $(".accordion_example7").smk_Accordion({
            activeIndex: 2
        });
        $(".accordion_example8").smk_Accordion();
    });

---

您需要多级切换。我想你想要这样的答案

HTML代码

<div class="container_demo">
        <div class="accordion_example2">

            <!-- Section 1 -->
            <div class="accordion_in">
                <div class="acc_head ">Heading1</div>
                <div class="acc_content">
                    it is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. 

                       <div class="accordion_example3"> 
                        <div class="accordion_in">
                            <div class="acc_head ">Inner Heading1</div>
                            <div class="acc_content">
                                it is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. 
                            </div>
                        </div>
                           <div class="accordion_in">
                            <div class="acc_head ">Inner Heading2</div>
                            <div class="acc_content">
                                it is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. 
                            </div>
                        </div>
                    </div>



                </div>
            </div>

            <!-- Section 2 -->
            <div class="accordion_in">
                <div class="acc_head" >Heading1</div>
                <div class="acc_content">
                    it is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. 

                </div>
            </div>

            <!-- Section 3 -->
            <div class="accordion_in">
                <div class="acc_head" >Heading2</div>
                <div class="acc_content">
                    it is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. 
                </div>
            </div>

        </div>
    </div>

---

共享代码的相关部分，即在JSFIDLE上。在JSFIDLE上添加代码。net@MichalLeszczyk谢谢你的信息。但我需要使用上面的插件。你能下载我的插件并告诉我需要在哪里添加代码吗？是的。但内部开关会立即打开和关闭。你能试一下并给出一个正确的代码吗。

jQuery(document).ready(function($){

        $(".accordion_example2").smk_Accordion({
            closeAble: true, 
        });

        $(".accordion_example3").smk_Accordion({

        });

    });