在我尽力解释我的需要的同时忍受我:)
我们有3个链接指向页面下方的锚点,如下所示:
<a href="#step1">Step 1</a>
转到<div id="#step1">
<a href="#step2">Step 2</a>
转到<div id="#step2">
<a href="#step3">Step 3</a>
转到<div id="#step3">
所以我要做的是动态定位我要去的元素。因此,如果我单击Step 1链接,我将转到id为step1的div,但使用jQuery选择目标元素(id为step1的div)。
所以这段代码不起作用,但我认为是正确的道路:
$(this).effect("highlight", {}, 3000);
...选择我点击的链接 - 不对!我想选择我在该链接中定位的元素。得到它?现在,我知道我可以对它进行硬编码,但是有一种方法可以动态定位我想要的东西。
如果这没有任何意义,我很抱歉。我会喜欢任何帮助和反馈。
谢谢!
答案 0 :(得分:4)
$($(this).attr('href')).effect("highlight", {}, 3000);
PS:请注意,您不需要在#
值中使用id
,所以
<div id="step1">
答案 1 :(得分:2)
这是我用来闪现#anchor链接目标的代码。维基百科使用类似的技术来制作脚注。
/**
* Temporary highlight targets of #anchor links.
*/
$('a').click(function() {
if (/#(.*)/.test($(this).attr('href'))) {
var $target = $('#' + RegExp.$1 + ', *[name="' + RegExp.$1 + '"]');
var repeats = 15;
function step() {
repeats--;
$target[repeats ? 'toggleClass' : 'removeClass']('target');
if (repeats) {
window.setTimeout(step, 50);
}
}
step();
}
});
(您必须在样式表中添加“目标”类来设置样式。)
BTW,只是为了让你知道:单独使用CSS3,使用它的:target伪类来设置target elements样式是可能的:
div:target {
color: red;
}
答案 2 :(得分:1)
在a标签的点击事件中,这指的是a元素。所以我假设你想要从那个标签中获取href,并使用你自己的逻辑突出显示div。
$($(this).attr('href')).effect("highlight", {}, 3000);