我有一个< ul>共有6件商品.每个项目都有一个规划,景观或环境类.这些项目是页面上jQuery Cycle幻灯片的一部分.如果正在显示的列表项是具有特定类的第一个项目,我打算做的是在页面上显示一些内容.
如下所示,我有两个列表项目,其中包含“计划”类.如何检测正在显示的列表项是否是第一个具有“计划”类的?
循环给了我一个很小的功能来帮助我,我只是不确定如何在我的帮助函数中编写if()来触发我想在页面上显示的项目.
任何帮助是极大的赞赏!
**编辑**这是jsfiddle:jsfiddle.net/73y2R/1
这是html:
<ul> <li class="planning"> <img src="images/pl_slide1.jpg"> <h2>Headline</h2> <p>Lorem Ipsum</p> </li> <li class="planning"> <img src="images/pl_slide1.jpg"> <h2>Headline</h2> <p>Lorem Ipsum</p> </li> <li class="landscape"> <img src="images/la_slide2.jpg"> <h2>Headline</h2> <p>Lorem Ipsum</p> </li> <li class="landscape"> <img src="images/la_slide2.jpg"> <h2>Headline</h2> <p>Lorem Ipsum</p> </li> <li class="environmental"> <img src="images/en_slide1.jpg"> <h2>Headline</h2> <p>Lorem Ipsum</p> </li> <li class="environmental"> <img src="images/en_slide1.jpg"> <h2>Headline</h2> <p>Lorem Ipsum</p> </li> </ul>
和助手功能:
function onBefore() { var theid = $(this).attr('class'); $('#services h4').removeClass('recolor'); $('#slideShow ul li').removeClass('showTitle'); if($(this).hasClass('planning')){ $('#arrow').animate({'paddingLeft':'60px'}); $('#' + theid).addClass('recolor'); } else if ($(this).hasClass('landscape')){ $('#arrow').animate({'paddingLeft':'330px'}); $('#' + theid).addClass('recolor'); } else if ($(this).hasClass('environmental')){ $('#arrow').animate({'paddingLeft':'598px'}); $('#' + theid).addClass('recolor'); } }