jQuery Accordion 和通过 AJAX 加载内容 [英] jQuery Accordion and loading content through AJAX

问题描述

我想使用 jQuery accordion 标头下的内容="http://docs.jquery.com/Ajax/load" rel="noreferrer">load 命令.目前，我已将其设置为以下

$(function() {$("#accordion").手风琴({标题:h2"，活动:假});$("h2", "#accordion").click(function(e) {var contentDiv = $(this).next("div");contentDiv.load($(this).find("a").attr("href"));});});

和 HTML(相关代码段)

<div><h2><a href="home.htm">首页</a></h2><div><!-- 内容占位符-->

<div><h2><a href="products.htm">产品</a></h2><div><!-- 内容占位符-->

现在这一切正常，但存在一个问题，即以这种方式加载内容会在某些浏览器 (IE6) 上中断手风琴插件的向下滑动动画，而在其他浏览器 (FF) 上，向下滑动动画不会发生.

我想在内容加载之前我需要阻止向下滑动动画(使用加载回调函数)，但我不确定如何将其挂接到手风琴插件中.

非常感谢任何想法！

解决方案

快速提醒一下.

这些答案都不会像预期的那样使用最新的 API，因为自 jQuery UI 1.9 事件 change 和 changestart 已更改为 'activate' 和 'beforeActivate' 分别.

希望能为某人节省几分钟时间.

I would like to load the content under each jQuery accordion header using the jQuery load command. Currently, I have set this up as the following

$(function() {

    $("#accordion").accordion({          
        header: "h2",
        active: false              
    });

    $("h2", "#accordion").click(function(e) {
        var contentDiv = $(this).next("div");
        contentDiv.load($(this).find("a").attr("href"));      
    });                    
});

and the HTML (relevant snippet)

<div id="accordion">
    <div>
        <h2><a href="home.htm">Home</a></h2>
        <div>
           <!-- placeholder for content -->
        </div>
    </div>
    <div>
        <h2><a href="products.htm">Products</a></h2>
        <div>
           <!-- placeholder for content -->       
        </div>
    </div>
</div>

Now this all works fine, but there is a problem in that loading content in this manner interrupts the slide down animation of the accordion plugin on some browsers (IE6), and on others (FF), the slide down animation does not occur.

I'm thinking that I would need to prevent the slide down animation from occurring until the content has loaded (using the load callback function) but am unsure how to hook this into the accordion plugin.

Any ideas greatly appreciated!

解决方案

Just a quick heads up.

None of these answers will work as expected with the latest API as since jQuery UI 1.9 the events change and changestart have been altered to 'activate' and 'beforeActivate' respectively.

Hope that saves someone a few minutes.

这篇关于jQuery Accordion 和通过 AJAX 加载内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！