聊天框头上的关闭按钮不起作用

我用静态用户制作聊天应用程序。并点击该用户，它会打开一个聊天室。但该聊天室上的关闭按钮不起作用。聊天框头上的关闭按钮不起作用

我正在使用jQuery来实现这一点。

$(document).ready(function() { 
    $('a').click(function(e) { 
    e.preventDefault(); 
    var targetUser = ($(this).html()); 
    $(document).data('chat.targetUser', targetUser); 
    var user = '<div class="user open" id="' + targetUser + '"><header><div class="status"></div><div class="header-text">' + targetUser + '</div><div class="close">&times;</div></header><div class="message-area"></div><div class="input-area"><input type="text" id="input" /></div></div>'; 
    $('#chat').append(user); 
    $('#chat').find(".close").click(function() { 
     $(this).closest(".user open").hide(); 
    }); 
    }); 
});

来源

2014-05-08 Reetika

动态添加聊天室吗？ – anna

对于在domready之后创建的元素上的绑定事件，使用'$（'＃item'）。on（'click'，function（）{/ * callback * /}）;' –

yes alig..chatbox opened when click on用户从用户列表中。 – Reetika

console.log($('#chat').find(".close"));，以找出是否选择工作

$("#chat .close").on("click", function() { 
    $(this).closest(".user open").hide(); 
});

来源

2014-05-08 11:04:33 anna

它的工作，但所有聊天框隐藏，而不是一个。 – Reetika

当你在运行时追加元素DOM，你一定要试试这里event delegation：

$('#chat').on("click",".close",function(){ 
     $(this).closest(".user open").hide(); 
});

事件委托允许我们将一个事件监听器附加到一个父元素，该元素将为匹配选择器的所有后代触发，whe那些现在存在的或后来增加的后代。

来源

2014-05-08 11:05:26

尝试以下代码： -

$('#chat').on("click", ".close" , function(){ 
      $(this).closest(".user open").hide(); 
     });

事件代理是指使用事件传播（鼓泡）来处理的过程中DOM中的事件比事件原来的元素更高inated。它允许我们为现在或将来存在的元素附加一个单一的事件监听器。

来源

2014-05-08 11:06:06 Neel

聊天框头上的关闭按钮不起作用

回答

相关问题