Контекст Jquery нажмите

Question

Я использую jquery для головок чата, в углу головок чата есть знак «X», чтобы удалить чат-головку, когда нажимаете на «X», то есть button, он также активирует раздел div чата. Структура чат голова как

<div class="name_right"> 

<button class="close_chat_in">X</button> 

</div> 

здесь fiddle, пожалуйста, посмотрите и предложить мне правильный путь, чтобы выполнить такие действия. , в то время как это работает отлично для статических элементов, но когда я загружаю элементы с помощью ajax или добавляю элемент, добавив его, он не работает. взгляните на скрипку, чтобы очистить точку.

Благодаря

Answer 1

Попробуйте Fiddle. Вам нужно остановить распространение событий после нажатия X.

Закрыть чат JS функции:

$("body").on("click", ".close_chat_in", function (ev) { 
     $(this).parent(".name_right").remove(); 
     alert("i am suppose to remove this chat head"); 
     $('body').append("<div class='name_right'><span/n/ style='border-radius:100%;margin:0px;padding:0px;color:black;background:#F78F1E;'></span>\n\<button class='close_chat_in' id=''>&nbsp;X&nbsp;</button></div>"); 
     ev.stopPropagation(); 
    }); 

Answer 2

Пожалуйста, добавьте больше кода на ваш вопрос, однако, изменения:

$("body").on("click", ".close_chat_in", function() { 

К

$("body div.name_right").on("click", ".close_chat_in", function() { 

Это просто перемещает слушателя в вашей DIV, а внутри все тело, и, таким образом, он не будет запускать другого слушателя одновременно.