функция Jquery не работает после того, как Ajax вызова

Question

Я получил эту функцию:

$(document).ready(function() { 
$('.post_button, .btn_favorite').click(function() { 


//Fade in the Popup 
$('.login_modal_message').fadeIn(500); 

// Add the mask to body 
$('body').append('<div class="overlay"></div>'); 
$('.overlay').fadeIn(300); 
return false; 
}); 

Моя страница загружается контент с любимыми кнопками, но после того, как Ajax вызова и генерируемой дополнительного нового контента функция не работает, если вы нажимаете кнопки нового контента. Что может быть не так?

Answer 1

Это потому, что вы используете динамический контент.

Вы должны изменить свой клик вызов делегированного метода как on

$('.post_button, .btn_favorite').on('click', function() { 

или

$("body").on("click", ".post_button, .btn_favorite", function(event) { 

Answer 2

Я не уверен, если я получаю свой вопрос прямо, но вы можете попробовать. .

$.ajax({ 
    url: "test.html" 
}).done(function() { 
    $('.post_button, .btn_favorite').click(function() { 


    //Fade in the Popup 
    $('.login_modal_message').fadeIn(500); 

    // Add the mask to body 
    $('body').append('<div class="overlay"></div>'); 
    $('.overlay').fadeIn(300); 
    return false; 
}); 

Просто попробуйте вставить код внутри done функция.

Надеется, что это помогает :)

EDIT: Я также заметил, что вы не хватаете }); на ваш вопрос.

Answer 3

Вместо этого:

$('.post_button, .btn_favorite').click(function() { 

сделать это:

$(document).on('click','.post_button, .btn_favorite', function() { 

on будет работать с существующими элементами и будущими те, которые соответствуют селектору.

Приветствия

Answer 4

Если вы знаете, контейнер для .post_button,.btn_favorite затем использовать

$('#container_id').on('click', '.post_button, .btn_favorite', function() { }); 

'.post_button, .btn_favorite' так, если не найден, то он будет пузыриться до container_id

еще, если вы не знаете, контейнер затем передать его в документ

$(document).on('click', '.post_button, .btn_favorite', function() { }); 

Reference

Answer 5

Следующие работали для меня

$(document).ready(function(){ 
     $(document).bind('contextmenu', function(e) { 
      if(e.button == 2 && jQuery(e.target).is('img')) { 
       alert('These photos are copyrighted by the owner. \nAll rights reserved. \nUnauthorized use prohibited.'); 
       return false; 
      } 
     }); 
    }); 

Answer 6

Вы должны связать щелчок событие JQuery, как только ваш Аякса содержание заменяется старое содержание

в блоке успеха AJAX вам нужно добавить код, как здесь новое содержание ответа HTML один тег как

<a href="#" id="new-tag">Click Me</a> 

Таким образом, вы можете связать новое событие щелчка после изменения содержимого с помощью следующего кода

$("#new-tag").click(function(){ 
    alert("hi"); 
    return false; 
});