JQuery：检测哪个span id有class =“active”，如果按下了按钮，则转到另一个span id(JQuery: detect which span id has class=“act

JQuery：检测哪个span id有class =“active”，如果按下了按钮，则转到另一个span id(JQuery: detect which span id has class=“active” and if button is pressed go to another span id)

我已经有一个脚本在我下面列出的每个span id之间切换，添加class active并将其删除，因此只有1 span id元素可见。

<div id="b_pager"> <span id="p1" class="active"></span> <span id="p2"></span> <span id="p3"></span> <span id="p4"></span> <span id="p5"></span> </div>

现在我想要做的是制作两个按钮（箭头类型），它们可以通过跨度ID进行导航。

示例：如果span id p3可见且右箭头 - >自动按下，则转到span id p4。 如果向左箭头< - 返回到p3，依此类推。

任何人都可以帮忙吗？ 提前致谢。

马特

I've got already one script that is toggling between every of span ids i've listed below adding class active and removing it so only 1 span id element is visible.

<div id="b_pager"> <span id="p1" class="active"></span> <span id="p2"></span> <span id="p3"></span> <span id="p4"></span> <span id="p5"></span> </div>

Now what i want to do, is make two buttons (sort of arrows) that will allow to navigate throught span ids.

Example: If span id p3 is visible and arrow right -> is pressed automatically go to span id p4. If pressed arrow left <- go back to p3, and so on.

Any one can help? Thanks in advance.

Matt

最满意答案

工作演示http://jsfiddle.net/HhUBR/

码

$('#next').click(function() { if ($('span:last').hasClass('active')) { $('#next').attr('disabled', true) } else { $('.active').removeClass().next().addClass('active'); } }) $('#prev').click(function() { if ($('span').eq(0).hasClass('active')) { $('#prev').attr('disabled', true) } else { $('.active').removeClass().prev().addClass('active') } })​

working demo http://jsfiddle.net/HhUBR/

CODE

$('#next').click(function() { if ($('span:last').hasClass('active')) { $('#next').attr('disabled', true) } else { $('.active').removeClass().next().addClass('active'); } }) $('#prev').click(function() { if ($('span').eq(0).hasClass('active')) { $('#prev').attr('disabled', true) } else { $('.active').removeClass().prev().addClass('active') } })​