Question

有人可以告诉我为什么这种手风琴没有用吗？

ajax调用工作正常，手风琴div的创建结构与accordion2 div相同（可以检查手风琴是否正常工作！）

div使用适当的类进行修饰：

<div id="accordion" class="ui-accordion ui-widget ui-helper-reset ui-accordion-icons" role="tablist">

但是就这一点而言。没有触摸动态创建的内容。 div只是正常呈现（即没有格式化，只是链接和文本交替，而不是手风琴！）

正如你所看到的，我已经尝试将调用分散到手风琴（），但无济于事。

这显然与条目是动态创建的事实有关。但谷歌搜索似乎发现其他人可以通过类似的设置获得良好的效果。

PS我很累，也很无能，所以这可能是愚蠢的事情！

    <script>
        $(document).ready(function() {

            $("#accordion").accordion({
                header: "h3"
            });

            $.ajax({
                type: "GET",
                url: "/api/blog",
                data: "{}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(blogs) {
                    for (var i in blogs) {
                        $('#accordion').append(
                            $('<div/>').append(
                                $('<h3></h3>').append(
                                    $('<a href="#"/>').append(
                                        blogs[i].Title
                                    )
                                )
                            ).append(
                                $("<div/>").append(
                                    blogs[i].Body
                                )
                            )
                        );
                    }
                    $("#accordion").accordion({
                        header: "h3"
                    });
                }
            });
            $("#accordion").accordion({
                header: "h3"
            });
            $("#accordion2").accordion({
                header: "h3"
            });
        });
    </script>
</head>
    <body>
    <div id="accordion"></div>
    <div id="accordion2">
            <div>
                <h3><a href="#">First</a></h3>
                <div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>
            </div>
            <div>
                <h3><a href="#">Second</a></h3>
                <div>Phasellus mattis tincidunt nibh.</div>
            </div>
            <div>
                <h3><a href="#">Third</a></h3>
                <div>Nam dui erat, auctor a, dignissim quis.</div>
            </div>
        </div>
    </body>
</html>

Answer 1

您可以将手风琴初始化两次太多次尝试删除其中两个：

$("#accordion").accordion({
                header: "h3"
            });

但保持ajax函数内的初始化，以便在初始化手风琴之前填充内容。

动态创建的手风琴不起作用。为什么？

1 个答案: