0

我正在使用我发现的一些代码在单击锚链接后突出显示一个 id。

我想修改它以突出显示<dd>定义列表中的下一个标签:

<dl class="mainfaq">
      <dt id="q1">Q1</dt>
         <dd><p>A1</p></dd>
      <dt id="q2">Q2</dt>
         <dd><p>A2</p></dd>
      <dt id="q3">Q3</dt>
         <dd><p>A3</p></dd>
</dl>

这是林肯循环的 jquery

    function highlight(elemId){
    var elem = $(elemId);
    elem.css("backgroundColor", "#ffffff"); // hack for Safari
    elem.animate({ backgroundColor: '#ffffaa' }, 1500);
    setTimeout(function(){$(elemId).animate({ backgroundColor: "#ffffff" }, 3000)},1000);
}

if (document.location.hash) {
    highlight(document.location.hash);
}
$('a[href*=#]').click(function(){
    var elemId = '#' + $(this).attr('href').split('#')[1];
    highlight(elemId);
});

我似乎无法使通常的 .next 或 .sibling 修改起作用。

4

2 回答 2

1

我会使用 n ext 相邻兄弟选择器

highlight(elemId + ' + dd');
于 2010-08-27T15:30:34.683 回答
0

我不完全确定您要实现什么,但假设您单击同一页面上的链接,然后尝试突出显示目标元素,您可以使用纯 css 解决方案:

:target + dd > p { /* css */ }

它的目标应该是pthat 的直接后代,dd它是target-eddt元素的直接兄弟。

不过,这种方法有一些注意事项;我无法想象 IE < 8(可能包括 8)会正确实现它。它几乎肯定需要一个有效的文档类型。

jsbin演示:http://jsbin.com/oqamu4

于 2010-08-27T15:39:44.493 回答