突出显示页面中的#部分 - jQuery

时间:2011-05-10 05:50:52

标签: jquery

我有一个简单的html页面

<html>
<div id="d1>Content</div>
<div id="d2>Content</div>
<div id="d3>Content</div>
<a href="page.html#d1">D1</a> <a href="page.html#d2">D2</a> <a href="page.html#d3">D3</a>
</html>

我想用我的脚本

突出显示所选的div
<script>
var divID=window.location.href.split('#')[1];
$(divID).blahblahEffect;
<script>

问题是这种情况只有在我第一次从X页面转移到page.html之后,在转到page.html后如果我点击任何链接它没有显示效果。

1 个答案:

答案 0 :(得分:2)

CSS

.highlight{ background-color :#FCFC9F; }

的jQuery

$("a").click(function (e) {
   $('div').removeClass('highlight');
   var hashId=this.hash.substr(1);
   $('#'+hashId).addClass('highlight');           
   e.preventDefault();
});

DEMO