时间戳

首页 > 解决方案 > 如何从jquery中选择用户单击的div

jquery - 如何从jquery中选择用户单击的div

问题描述

我正在使用 jquery 自动完成功能，在选择任何项目后，我添加了一个新的 div，其类设置为，active_chat因此该 div 变为活动状态。在添加新 div 之前，我active_chat从以前的 div 中删除，因此只有最后添加的 div 保持活动状态。

现在我想为用户提供单击任何其他非活动 div 并使其处于活动状态的选项，即设置其类active_chat。为此，我正在寻找代码来选择用户单击的 div，但我不知道该怎么做，因为我的代码提供了所有 div，而我实际上不知道用户单击了哪个 div。

以下是我的主要 div 包含所有元素

<div class="inbox_chat" id="inboxchat">                        
</div>

以下是我用来动态添加新 div 并将其类设置为的 jqueryactive_chat

$("#users").autocomplete
({
    select: function (event, ui)
    {
        $('.chat_list').removeClass("active_chat");
        $('#inboxchat').prepend('<div class="chat_list active_chat"><div class= "chat_people"><div class="chat_img"> <img src="mypic.jpg" alt="sometitle"></div><div class="chat_ib"><h5>my name<span class="chat_date">Dec 25</span></h5><p>sometext</p></div></div></div>');
    }
});

以下是我用来选择用户单击的当前 div 但它正在选择所有 div 的代码

$(document).on('click', '#inboxchat', function () {
    var clicked = $(this).siblings();
    console.log(clicked);
    alert("now1");
});

当用户单击任何 div 时，我只想active_chat为该 div 设置并从其他 div 中删除此类。

编辑
我正在设置active_chat一个名为chat_list

标签： jqueryhtmldynamicautocomplete

解决方案

如果您希望它在页面上的任何 div 上工作，请尝试此操作：

$('div').on('click', function(){
    $("div").removeClass("active_chat");
    $(this).addClass("active_chat");
});

这是否只适用于“inbox_chat”类的div？如果是这样，请尝试：

$('div. inbox_chat').on('click', function(){
    $("div").removeClass("active_chat");
    $(this).addClass("active_chat");
});

推荐阅读