jQuery手风琴并通过AJAX加载内容 [英] jQuery Accordion and loading content through AJAX

查看:120
本文介绍了jQuery手风琴并通过AJAX加载内容的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

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"));      
    });                    
});

和HTML(相关代码段)

<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>

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

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.

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

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!

推荐答案

请快速注意.

这些答案都无法与最新API一起使用,因为自jQuery UI 1.9起,事件changechangestart已更改为' beforeActivate '.

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手风琴并通过AJAX加载内容的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆