jQuery kliknij zdarzenie nie działa, gdy treść jest nadpisane przy użyciu Ajax

Question

wyjaśniłem problem poniżej tego kodu

<div id='content'> 

<div id='help'> 
blah blah blah 
once there lived a king named midas 
blah blah blah 
</div> 

<script> 
$(document).ready(function() { 
    $('#help').click(function() { 
      $('help').hide(500); 
    }) 
}) 
</script> 

<!-- bottom of the page after a long other content --> 
</div> 
<!-- end of div id= content --> 

<script> 
function ondelete() 
{ 
// doing an ajax request to after deleting some items to dynamically update a list. 
// the result will also have the same above div code with that help div 
    document.getElementById('content').innerHTML = xmlHTTP.responseText 
} 
</script> 

Jest częścią zawartości wewnątrz div, która ma „treści” jako jego id Wewnątrz I pomoc div. Który jest display: none bydefault i jeśli użytkownik kliknie przycisk pomocy robię

$('#help').show(500); 

i gdy użytkownik kliknie ten sam przycisk pomocy lub jeśli użytkownik kliknie wewnątrz pomocy div następnie zrobić ten kod, aby ukryć div $ ('# help'). hide (500)

Działa to dobrze, dopóki nie wykonam żądania ajax, aby zaktualizować zawartość div id = 'content' Nadpisuję ten sam div pomocy z tym samym zadowolony. to tak, jak nadpisuję cały obszar zawartości z wyjątkiem nagłówka i stopki.

ale po zaktualizowaniu go z tekstem odpowiedzi zdarzenie click w górnej części kodu, który jest wewnątrz document.ready nie działa jak onclick gdzie pracuje na tym dział

mi o to działa dobrze. bez tego po kliknięciu i tym kodem gotowym powyżej dokumentu nie działa po zastąpieniu z ajax.

Z mojego doświadczenia wynika, że ​​kod lub łącza javascript nie działają, gdy kod ze znacznikami src skryptu i znacznikami skryptu jest dynamicznie pobierany i aktualizowany przy użyciu ajax.

Teraz używam onclick zamiast tego dokumentu gotowego do ukrycia i pokazania pomocy div.

a przede wszystkim

when there is a overwrite from ajax if you again set 
$(#'help').click = .... code 
this works. 

like 
function ondelete() 
{ 
    document.getElementById('content').innerHTML = xmlHTTP.responseText 
    $('#help').click (function() { $('#help').hide(500); }); 
} 

więc wydaje się, że trzeba zaktualizować wszystkie załączone wydarzeń podczas aktualizowania go za pomocą AJAX.

Prosimy o zgłaszanie uwag i sugestii w celu rozwiązania tego problemu.

Answer 1

spróbuj użyć .live().

$(document).ready(function() { 
    $('#help').live('click', function() { 
      $(this).hide(500); 
    }); 
}); 

.live (eventType, obsługę)

od wersji 1.9 .live() została wycofana.

Następnie można użyć http://api.jquery.com/delegate/

Dołącz do obsługi zdarzenia dla wszystkich elementów, które pasują do aktualnego selektor, teraz lub w przyszłości.

Answer 2

Spróbuj:

$('#help').live('click', function() { 
    // ... 
}); 

zamiast:

$('#help').click(function() { 
    // ... 
}); 

Answer 3

żywo jest przestarzała. Powinieneś użyć na.

$ (document) .Na ("click", "wyboru", function() {

jest na żywo/format delegowanych w sprawie.

http://api.jquery.com/live/

Answer 4

I to naprawdę teraz działa zgodnie z oczekiwaniami.

$(document).on("click","#id_of_anything_div_input_button_etc", function() { 
old_body_of_functon_called_right_here(); }); 

function old_body_of_functon_called_right_here() { /* ... */}