需要使用jQuery选择器的帮助

3

I've got code like that:

<ul class="gallery_demo_unstyled">
    <li class="active"><img src='001.jpg' /></li> 
    <li><img src='002.jpg' /></li> 
    <li><img src='003.jpg' /></li> 
    <li><img src='004.jpg' /></li> 
    <li><img src='005.jpg' /></li> 
    <li><img src='006.jpg' /></li> 
</ul> 

<div class="Paginator"> 
    <a href="../2/" class="Prev">&lt;&lt;</a> 
    <a href="../1/">1</a> 
    <a href="../2/">2</a> 
    <span class="this-page">3</span> 
    <a href="../4/">4</a> 
    <a href="../5/">5</a> 
    <a href="../4/" class="Next">&gt;&gt;</a> 
</div> 

<div class="Albums"><div class="AlbumsMenu">
<p><b>ALBUMS</b></p>
    <p><a href="../../blackandwhite/1/" >blackandwhite</a></p>
    <p><a href="../../color/1/" class='this-page'>>>color</a></p>
    <p><a href="../../film/1/" >film</a></p>
    <p><a href="../../digital/1/" >digital</a></p>
    <p><a href="../../portraits/1/" >portraits</a></p>
</div></div>  

...以及一些JavaScript/jQuery,允许循环浏览图片(即顶部的li元素),在最后一张图后返回第一张:

$$.nextSelector = function(selector) {
return $(selector).is(':last-child') ?
       $(selector).siblings(':first-child') :
       $(selector).next();

};

当前页面始终具有“this-page”类(在我的情况下是span或p,但如果必要,我可以更改它)。

问题:我应该在我的代码中进行哪些更改,以使其在最后一张图像之后进入下一页,而不是一遍又一遍地循环浏览页面,并且在最后一页后进入下一个相册?并且在最后一个-最后一个-最后一个图像之后回到第一个相册的第一页上的第一张图片(或者只停在那里 - 真的不在意)?


你是如何更新图库中的图片列表和页面的?是否有一个 AJAX 请求来更新 ul.gallery_demo_unstyled 当新页面被打开时,以及 div.AlbumsMenu 当新相册被打开时? - Anurag
@anurag: 这是 <a href'http://lomoportfolio.com/trunk/jquery.galleria.js'>galleria.js</a> 脚本。我使用 Django 生成包含图像列表、页码和相册链接的 HTML,每个相册页面一个 HTML,并且在同一页内,通过单击大图像动态更改 [li class =“active”] 的位置。示例演示:http://lomoportfolio.com/strangers.html,但现在它在同一页循环。我希望它能够到达下一页,然后到达最后一页上的下一个相册。 - user63503
1个回答

4

类似这样的内容:

function nextImage()
{
    var li = $('#gallery_demo_unstyled li.active');

    if (li.is(':last-child')) {
        nextPage();
    } else {
        li.removeClass('active');
        li.next().addClass('active');
    }
}

function nextPage()
{
    var next = $('div.Paginator a.Next');

    if (next.length == 0) {
        nextAlbum();
    } else {
        window.location = next.attr('href');
    }
}

function nextAlbum()
{
    var this_album = $('div.AlbumsMenu p a.this-name');
    var p = this_album.parent();

    if (p.next().length == 0) {
        return;
    }

    window.location = p.next().children('a').attr('href');
}

为了使其正常工作,它需要返回选择器而不是实际执行所有操作。我会考虑如何修改它。但是谢谢! - user63503

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接