Question

当我点击任何名称时，我必须为所选名称的锚标记以及该用户的部门名称添加“活动”类。

<ul id="orglistingid">
    <li> 
        <a>Sales </a> <!--Deparemtn Name -->
        <ul id="dId">
           <li> 
              <a>Rahul </a> <!--User -->
          </li>
           <li> 
              <a>Nitin </a>
          </li>
        </ul>
    </li>
</ul>
<ul id="orglistingid">
    <li> 
        <a class="active">Development</a>
        <ul>
           <li id="dId"> 
              <a class="active">Rokesh </a>
          </li>
           <li> 
              <a>Preeti</a>
          </li>
        </ul>
    </li>
</ul>

我正在使用下面的代码，任何人都可以告诉我需要做什么更正..？

if (orgID != null && orgID == 'dId') {
    $("#dId li a").removeClass("orglistactive");
    $(this).attr("class","orglistactive");

    var parentID = $(e.target).parent().parent().parent().attr("id");
    alert($(e.target).parent().parent().parent().attr("id"));

    $("#"+parentID+" a").attr("class","orglistactive");
}

Answer 1

看起来你正在努力实现如下所示的目标：

<script type="text/javascript">
var orgID = $('#dId');

if(orgID.attr('id') == 'dId'){
     orgID.find('>li>a').addClass("orglistactive"); 
     var parentID = orgID.attr("id");
     alert(orgID.attr("id"));
} 
</script>

但是从html和jquery的角度来看，发现了一些事情并不正确。

ID是唯一的，但您已使用'dId'多次。
e.target仅在附加了元素的事件时才有效，或者可以使用“window.event || e”捕获。在你的代码中，我看不到e.target

希望这有帮助！：）

Answer 2

这可以通过一些jQuery快速实现。

第一种方法

$('ul a').click(function(){
    $(this).addClass('orglistactive');
    $(this).parent().parent().parent().find('a:first').addClass('orglistactive');
});

观看现场演示：http://jsfiddle.net/augusto1982/6xM2P/

第二种方法

要记住的一件事是，如果页面中没有其他列表，则此代码可以正常工作。如果不是这种情况，则应使用一些CSS类来确定要绑定单击函数的对象。否则，jQuery选择器会有点混乱。

$('#orglistingid li ul li a').click(function(){
    $(this).addClass('orglistactive');
    $(this).parent().parent().parent().find('a:first').addClass('orglistactive');
});

示例：http://jsfiddle.net/augusto1982/GXcvD/

第三种方法

我还建议您为每个用户锚点添加类，以便更轻松。

<强> HTML

<ul id="orglistingid">
    <li> 
        <a>Sales </a> <!--Deparemtn Name -->
        <ul id="dId">
           <li> 
              <a class='user'>Rahul </a> <!--User -->
          </li>
           <li> 
              <a class='user'>Nitin </a>
          </li>
        </ul>
    </li>
</ul>
<ul id="orglistingid">
    <li> 
        <a class="active">Development</a>
        <ul>
           <li id="dId"> 
              <a class="active user">Rokesh </a>
          </li>
           <li> 
              <a class='user'>Preeti</a>
          </li>
        </ul>
    </li>
</ul>

<强>的jQuery

$('.user').click(function(){
    $(this).addClass('orglistactive');
    $(this).parent().parent().parent().find('a:first').addClass('orglistactive');
});

看看第二个例子：http://jsfiddle.net/augusto1982/GW4mt/

最终方法

为了避免所有parent()...parent()次调用，您可以使用closest方法，但需要稍微更改一下HTML。

<强> HTML

<ul id="orglistingid">
    <li class='department'> 
        <a>Sales </a> <!--Deparemtn Name -->
        <ul id="dId">
           <li> 
              <a class='user'>Rahul </a> <!--User -->
          </li>
           <li> 
              <a class='user'>Nitin </a>
          </li>
        </ul>
    </li>
</ul>
<ul id="orglistingid">
    <li class='department'> 
        <a class="active">Development</a>
        <ul>
           <li id="dId"> 
              <a class="active user">Rokesh </a>
          </li>
           <li> 
              <a class='user'>Preeti</a>
          </li>
        </ul>
    </li>
</ul>

<强>的jQuery

  $('.user').click(function(){
    $(this).addClass('orglistactive');
    $(this).closest('.department').find('a:first').addClass('orglistactive');
    });

演示：http://jsfiddle.net/augusto1982/e7PVF/

与其他评论一样，我建议您拥有唯一的ID。虽然这不是限制，但这是一种最佳做法。

如何使用ajax动态添加类。？

2 个答案:

第一种方法

第二种方法

第三种方法

最终方法