JQuery UI Accordion无法处理AJAX加载的内容

我试图动态加载一个产品信息页面，该页面有一个供用户浏览的手风琴菜单。我在点击按钮后使用AJAX动态地为手风琴引入内容。手风琴的HTML以它应该的方式显示，但是没有执行手风琴“方法”来将内容修改为手风琴

进口：

<link rel="stylesheet" href="css/supersized.css" type="text/css" media="screen" />
<link rel="stylesheet" href="theme/supersized.shutter.css" type="text/css" media"screen" />
<link rel="stylesheet" href="css/NewSite.css" type="text/css" media="screen" />
<link rel="stylesheet" href="/resources/demos/style.css">    
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script type="text/javascript" src="js/jquery.easing.min.js"></script>
<script type="text/javascript" src="/development-bundle/ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="/development-bundle/ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="/development-bundle/ui/jquery.ui.accordion.js"></script>
<script type="text/javascript" src="js/supersized.3.2.7.min.js"></script>
<script type="text/javascript" src="theme/supersized.shutter.min.js"></script>
<script type="text/javascript" src="js/jquery.ModalWindow.js"></script>

JQuery中的手风琴调用：

    <script type="text/javascript">
    jQuery(document).on('click', '.subMenuItem', function()
    {   
        event.preventDefault(); 
        var subMenuItemID = '#' + $(this).attr('id');
        var menuItemContent = $('#MenuItemContent');

        var mainCategory = $(this).attr('id').split('xx')[0];
        var subCategory = $(this).attr('id').split('xx')[1];
        $.ajax({                                                          
                  url: '/php/SubMenuItemContent.php',         
                  data: {
                          MainCategory: mainCategory,
                          SubCategory: subCategory
                        },

                  success: function(result) {
                      menuItemContent.html(result);  
                  }
                });

            $('.accordion').accordion({
                    heightStyle: "content",
                    active: false,
                    collapsible: true
                    });
        }
    });
</script>  

jQuery（文档）.on（'单击'，'子菜单项'，函数（））
{   
event.preventDefault（）；
var subnumItemId='#'+$（this.attr（'id'）；
var menuItemContent=$（“#menuItemContent”）；
var maincegory=$（this.attr（'id'）.split（'xx'）[0]；
var subCategory=$（this.attr（'id'）.split（'xx'）[1]；
$.ajax（{
url:“/php/subnumitemcontent.php”，
数据：{
主要类别：主要类别，
子类别：子类别
},
成功：功能（结果）{
menuItemContent.html（结果）；
}
});
$（'手风琴'）.手风琴({
高度样式：“内容”，
活动：错误，
可折叠：正确
});
}
});

---

AJAX生成的标记是正确的，但是手风琴没有正确显示，它显示为H3和div的普通块。

两件事，首先，脚本末尾有一个额外的

其次，由于尚未加载accordion DOM元素（它们在AJAX调用中加载），因此没有正确加载accordion内容，因此请在

子项content.php

文件中放置以下内容：

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

 $('.accordion').accordion({
  heightStyle: "content",
  active: false,
  collapsible: true
 });

})
</script>

---

但无论出于何种原因，我在使用前面的方法时取得了更大的成功。

为了澄清，我需要在ajax将手风琴插入我的页面之前初始化它？要做到这一点，我还需要将相关的jquery脚本包含到subnumitemcontent.php文件中吗？如果在ajax调用之前需要加载一个accordion，那么可以在原始页面和

subnumitemcontent.php

上调用

accordion（）。非常感谢你！现在我只需要对样式做一点修改，我不太喜欢它们的默认设置：P编辑：它们都有效！！非常感谢！我们能否运行一个已解决问题的示例，以便看到解决方案的实际效果？
success: function(result) {
 menuItemContent.html(result);
 $('.accordion').accordion({
  heightStyle: "content",
  active: false,
  collapsible: true
 });
}