jQuery活动按钮子

时间:2013-02-14 08:10:11

标签: javascript jquery

$(document).ready(function(){
  $("#menu ul").children('li').each(function(){
    var href = $(this).find('a').attr('href');
    var wpl = window.location.pathname;
    if( href.indexOf(wpl) != -1 ){
      if( wpl.indexOf( "category" ) != -1){
        $("#products").attr('id','prodon');
      }
      if( wpl.indexOf( "news" ) != -1){
        $("#news").attr('id','newson');
      }
      if( wpl.indexOf( "wheretobuy" ) != -1){
        $("#WTB").attr('id','WTBon');
      }....

它会持续一些不同的按钮。 我只是这样做,因为每个按钮都是一个图像所以它们都是独一无二的。这是HTML的片段:

<li><a href="/news/index" id="news"></a></li>
<li>
  <a href="/site/wheretobuy" id="WTB"></a>
  <ul>
    <?php echo '<li>'.CHtml::link(CHtml::encode("Showrooms"), array('/showroom/index')).'</li>'; ?>
    <?php echo '<li>'.CHtml::link(CHtml::encode("Dealers"), array('/dealers/index')).'</li>'; ?>
    <?php echo '<li>'.CHtml::link(CHtml::encode("Hypermarket and Merchants"), array('/hyper/index')).'</li>'; ?>
  </ul>
</li>

所以父节点都很好。此外,如果孩子的URL包含父母的URL(即类别/猫),则显示活动按钮。我想知道如何应用父项;如果其中一个子项是URL,但不是相同的措辞,则是活动的img。我可以做一些更多的IF,但我认为这是一种更简单的方法。

再次编辑....

  if( wpl.indexOf( "wheretobuy" ) != -1 || $('#menu ul').find('.WTBon').parent().closest('li').indexOf( "wheretobuy" ) != -1 ) { 

    $('.WTB').addClass('WTBon');

}

所以我要检查的是节点的父节点是否在URL中有wheretobuy

1 个答案:

答案 0 :(得分:0)

试试这个:

改为添加ids add as class name

$('#menu ul').find('.idon').parent()
             .closest('li').addClass('.idon'); // <--id like //newson//

更新最新版本:

if($('#menu li a[href*="wheretobuy"]').length){
   $('#menu a[href*="wheretobuy"]').parent('li').addClass('WTBon');
}

注意:

不鼓励在单个页面上对多个元素使用相同的ID。这不是一个好习惯。

This applies in your case too因为you have applied it by making the active one as id,您可以use it as a class instead