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

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

<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>

---

看起来您正试图实现以下目标：

<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>

var orgID=$（'dId'）；
if（orgID.attr（'id'）='dId'）{
orgID.find（'>li>a'）.addClass（“orglistactive”）；
var parentID=orgID.attr（“id”）；
警报（orgID.attr（“id”））；
} 

但从html和jquery的角度来看，有两件事情是不正确的

Id是唯一的，但您已多次使用“dId”

e、 仅当存在附加了元素的事件或可以使用“window.event | | e”捕获事件时，目标才起作用。在你的代码中，我看不出e.target的用途

---

希望这有帮助！：）

只需使用一点jQuery就可以快速实现这一点

第一种方法 请看一个现场演示：

第二种方法 需要记住的一件事是，如果页面中没有其他列表，则此代码可以正常工作。如果不是这样，您应该使用一些CSS类来确定绑定click函数的对象。否则，jQuery选择器会变得有点混乱

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

例如：

第三种方法 我还建议您为每个用户锚添加一个类，以使其更简单

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>

<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>

请看第二个示例：

最后进近 为了避免所有的

parent（）…parent（）

调用，可以使用

最近的
方法，但需要稍微更改HTML

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>

<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>

演示：

和其他评论一样，我建议您使用唯一的ID。虽然这不是一个限制，但这是一个最佳实践。
我们可以拥有您所有的JS代码吗？
orgID！=null
是多余的。jQuery实例不能为null。删除时缺少true
<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>

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