0

有人能告诉我为什么这架手风琴不工作吗？

ajax 调用工作正常，并且手风琴 div 使用与手风琴 2 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>
4

1 回答 1

0

对于一个你初始化你的手风琴两次太多次尝试删除其中两个：

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

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

于 2012-09-13T18:49:18.410 回答