2012-03-29 49 views
0

我想排序我的网站,所以当我点击一个锚点链接时,它突出显示标题和它下面的部分。我说得对,但我正在努力解决一些问题。jquery nextuntil过滤多个类

我有一些HTML这样的:

<p id="pp1" class="Subsubhead">Stuff</p> 
<p>Nonsense</p> 
<p>More</p> 
<p id="pp7" class="Subsubhead">Meow</p> 
<p>Lorem</p> 
<p class="subhead"> 

,我有一些JavaScript,几乎就像:

function highlight(elemId) { 
    var elem = $(elemId); 

    elem.nextUntil(".Subsubhead").addClass("snaphighlight"); 

    //elem.addClass("snaphighlight"); 
    setTimeout(function() { 
     elem.removeClass("snaphighlight") 
    }, 1000); 
} 

$('#navigation a').click(function (event) { 
    var elemId = '#' + $(this).attr('href').split('#')[1]; 
    highlight(elemId); 
}); 

这个目前并不突出的标题,但它确实突出<p>标签直到下一个Subsubhead。然而,当下一个p有一个Subhead类时,它会一直高亮显示我不想要的。有没有办法告诉它nextUntil ".subsubhead"&&".subhead"或类似的东西?我的超时时间也不起作用了。我该如何解决这个问题?

回答

1

要应用的类众多元素,但只能从一个

删除它试试这个:

function highlight(elemId) { 
    var elem = $(elemId); 
    var highlight=elem.nextUntil(".Subsubhead").addClass("snaphighlight"); 

    //elem.addClass("snaphighlight"); 
    setTimeout(function() { 
     highlight.removeClass("snaphighlight") 
    }, 1000); 
} 

使用##一个jQuery选择你的语法是无效的,应该只使用一个#

+0

这适用于超时。使用Coldfusion所以使用#会导致问题。这是唯一的原因二。 CF开发人员了解。 – Jarede 2012-03-29 11:59:48

+0

我也做CF工作,但发布服务器代码和客户端代码的混合只会增加混乱,当你所有显示的是HTML和JavaScript – charlietfl 2012-03-29 14:24:12