我该如何申请一个jQuery手风琴div的通过AJAX加载

本文介绍了我该如何申请一个jQuery手风琴div的通过AJAX加载的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我试图把一个div我与jQuery的负载功能到一个jQuery的手风琴。

我不完全知道我做错了。我第一次加载nav.html到#nav然后我试图使#nav成一个jQuery的手风琴。 #nav加载正确，但我似乎无法使之成为一个手风琴。

的index.html

 ＆LT;！DOCTYPE HTML＆GT;
＆LT; HTML＆GT;
＆LT; HEAD＆GT;
    ＆所述;脚本的src =的http：//$c$c.jquery.com/jquery-1.9.1.js＆GT;＆所述; /脚本＆GT;
    ＆所述;脚本的src =的http：//$c$c.jquery.com/ui/1.10.3/jquery-ui.js＆GT;＆所述; /脚本＆GT;
    ＆LT;脚本＆GT;
        $（文件）。就绪（函数（）{
            $（＃NAV）的负载（nav.html）。
        }）;
        $（文件）。就绪（函数（）{
            $（＃accordionNav）。手风琴（{
                heightStyle：内容，
                可折叠：真，
                主动：1
            }）;
        }）;
    ＆LT; / SCRIPT＆GT;
＆LT; /头＆GT;
＆LT;身体GT;
    ＆LT; DIV ID =导航＆GT;＆LT; / DIV＆GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;

nav.html：

 ＆LT;导航＆GT;
    ＆LT; DIV ID =accordionNav＆GT;
    ＆LT; H3＆GT;调查＆LT; / H3＆GT;
        ＆LT; DIV CLASS =accordionDropDown＆GT;
            ＆LT; UL ID =调查＆GT;
                ＆LT;李＆GT;＆LT; A HREF =Nutritional_Supplement.html'＆GT;营养补充剂LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;李＆GT;＆LT; A HREF =Probiotics.html'＆GT;益生菌＆LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;李＆GT;＆LT; A HREF =＆GT'HTML';脂肪酸LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;李＆GT;＆LT; A HREF =Trace_Minerals.html'＆GT;微量元素和LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;李＆GT;＆LT; A HREF =Fibre_Supplement.html'＆GT;纤维补充剂LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;李＆GT;＆LT; A HREF =Bowel_Supplement.html'＆GT;肠道补充＆LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;李＆GT;＆LT; A HREF =Liver.html'＆GT;肝＆LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;李＆GT;＆LT; A HREF =Adrenal_Support.html'＆GT;肾上腺支持＆LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;李＆GT;＆LT; A HREF =Digestive_Enzymes.html'＆GT;消化酶＆LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;李＆GT;＆LT; A HREF =Cleanse.html'＆GT;净化＆LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;李＆GT;＆LT; A HREF =Immune_Supplement.html'＆GT;免疫补充＆LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;李＆GT;＆LT; A HREF =Yeast.html'＆GT;酵母＆LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;李＆GT;＆LT; A HREF =Stressed.html'＆GT;强调＆LT; / A＆GT;＆LT; /李＆GT;
                ＆LT;李＆GT;＆LT; A HREF =Joints.html'＆GT;关节＆LT; / A＆GT;＆LT; /李＆GT;
            ＆LT; / UL＆GT;
        ＆LT; / DIV＆GT;
    ＆LT; / DIV＆GT;
＆LT; / NAV＆GT;

解决方案

使用 .load的回调函数（）方法：

  $（文件）。就绪（函数（）{
    $（＃NAV）。负载（nav.html，函数（）{
        $（＃accordionNav）。手风琴（{
            heightStyle：内容，
            可折叠：真，
            主动：1
        }）;
    }）;
}）;

I'm trying to turn a div i with jQuery's load function into a jQuery accordion.

I'm not entirely sure what I'm doing wrong. I first load nav.html to #nav then I attempt to make #nav into a jQuery accordion. #nav loads correctly but I can't seem to make it into a accordion.

Index.html

<!DOCTYPE HTML>
<html>
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    <script>
        $(document).ready(function(){
            $("#nav").load("nav.html"); 
        });
        $(document).ready(function(){
            $("#accordionNav").accordion({
                heightStyle: "content",
                collapsible: true,
                active: 1
            });
        });
    </script> 
</head>
<body>
    <div id="nav"></div>
</body>
</html>

nav.html:

<nav>
    <div id="accordionNav">
    <h3>Surveys</h3>
        <div class="accordionDropDown">
            <ul id="surveys">
                <li><a href='Nutritional_Supplement.html'>Nutritional Supplement</a></li>
                <li><a href='Probiotics.html'>Probiotics</a></li>
                <li><a href='.html'>Fatty Acids</a></li>
                <li><a href='Trace_Minerals.html'>Trace Minerals</a></li>
                <li><a href='Fibre_Supplement.html'>Fibre Supplement</a></li>
                <li><a href='Bowel_Supplement.html'>Bowel Supplement</a></li>
                <li><a href='Liver.html'>Liver</a></li>
                <li><a href='Adrenal_Support.html'>Adrenal Support</a></li>
                <li><a href='Digestive_Enzymes.html'>Digestive Enzymes</a></li>
                <li><a href='Cleanse.html'>Cleanse</a></li>
                <li><a href='Immune_Supplement.html'>Immune Supplement</a></li>
                <li><a href='Yeast.html'>Yeast</a></li>
                <li><a href='Stressed.html'>Stressed</a></li>
                <li><a href='Joints.html'>Joints</a></li>
            </ul>
        </div>
    </div>
</nav>

解决方案

Use the callback function of .load() method:

$(document).ready(function () {
    $("#nav").load("nav.html", function () {
        $("#accordionNav").accordion({
            heightStyle: "content",
            collapsible: true,
            active: 1
        });
    });
});

这篇关于我该如何申请一个jQuery手风琴div的通过AJAX加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！