Question

我在加载AJAX的内容中使用jCarousel Lite插件：这是（简化）代码

HTML：

<div id="#content">
    <ul>
        <li>First Item</li>
        <li>Second Item</li>
        <li>ThirdItem</li>
    </ul>
    <div id="pager>
        <a href="#" class="p1">1</a>
        <a href="#" class="p2">2</a>
        <a href="#" class="p3">3</a>
    </div>
</div>

jQuery的：

$('.ajax').click(function(){
    var url = $(this).attr('href');
    $('#content').load(url, null, function(response){
        if (response != '') {
            $('#content').jCarouselLite({
                visible: 1,
                scroll: 1,
                circular: false,
                btnGo: ['.p1', '.p2', '.p3']
            });
        }
    });
    return false;
})

到目前为止一切都很好：将AJAX内容加载到#content中，附加了jCarousel Lite，并且#pager链接按预期工作（它们只是滚动项目）

现在我想在#pager链接中添加更多内容（比如向它们添加类，或者打开警报，或者无论如何）：由于内容是加载了AJAX，我使用.live函数：

$('#pager a').live('click', function(e){
    alert('hello!');
    $('#pager a').removeClass('selected');
    $(this).addClass('selected');
})

嗯，没有任何反应！如果我删除jCarousel脚本（jQuery代码中的第5-10行），则所有内容都会再次运行

拜托，你能帮忙让它发挥作用吗？为什么jCarousel停止.live工作？有解决方法吗？

提前致谢

Answer 1

知道了！
我发现只有#pager链接不起作用，所以我看了jCarousel Lite插件代码并更改了第264行（jcarousellite_1.0.1.js）：

$(val).click...

使用

$(val).live...

带有AJAX加载内容的jCarousel Lite：.live（）停止工作

1 个答案: