作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试动态加载产品信息页面,该页面具有供用户浏览的 Accordion 菜单。单击按钮后,我使用 AJAX 动态引入 Accordion 的内容。 Accordion 的 HTML 以其应有的方式显示,但没有执行 Accordion “方法”来将内容修改为 Accordion 。
进口:
<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>
<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>
最佳答案
两件事,首先你有一个额外的}
在脚本的末尾。
其次, Accordion 内容未正确加载,因为 Accordion DOM 元素尚未加载(它们已在您的 AJAX 调用中加载),因此请输入您的 SubMenuItemContent.php
文件:
<script>
jQuery(document).ready(function($) {
$('.accordion').accordion({
heightStyle: "content",
active: false,
collapsible: true
});
})
</script>
accordion()
调用您的
success
回调如下:
success: function(result) {
menuItemContent.html(result);
$('.accordion').accordion({
heightStyle: "content",
active: false,
collapsible: true
});
}
关于ajax - JQuery UI Accordion 不适用于 AJAX 加载的内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23373268/
我是一名优秀的程序员,十分优秀!