我们有许多与rel属性的链接:
<div class="team-tags">
<a class="s1" rel="t1 t2 t3" href="#">One</a>
<a class="s2" rel="t2 t3" href="#">Two</a>
<a class="s3" rel="t1" href="#">Three</a>
<a class="s4" rel="t4 t6" ref="#">Four</a>
<a class="s5" rel="t2 t5" href="#">Five</a>
</div>和一个ul
<ul class="team">
<li class="t1">Some text</li>
<li class="t2">Some text</li>
<li class="t3">Some text</li>
<li class="t4">Some text</li>
<li class="t5">Some text</li>
<li class="t6">Some text</li>
</ul>每个链接的rel可以有多个值(如class="value1 value2 value3 value4")。每个值用于标记类似的class of <li>。
rel="t2 t3"标记<li class="t2">Some text</li>和<li class="t3">Some text</li>。诸若此类。
主要思想-当我们使用这些链接中的任何一个时,脚本应该在.team列表中找到具有类似类的li,并为它们切换active类。
例如,如果我们使用hover链接rel="t4 t6",脚本应该为<li class="t4">Some text</li>和<li class="t6">Some text</li>切换类active,比如<li class="t4 active">Some text</li>和<li class="t6 active">Some text</li>。
使用jQuery 1.3.2。
有什么想法吗?
谢谢。
发布于 2010-07-13 14:28:51
如下所示:
function getTeams(elem) {
return $('.' + elem.rel.replace(' ', ', .'));
}
$('.team-tags a[rel]').hover(
function() { getTeams(this).addClass('active'); },
function() { getTeams(this).removeClass('active'); }
);演示
https://stackoverflow.com/questions/3238129
复制相似问题