jQuery ne fonctionne pas en AJAX Chargement de la page
J'utilise jQuery pour charger une page en AJAX à l'aide de $.ajax (à supposer que test.html).
Ses un simple document HTML avec quelques boutons et associé à des animations en cliquant sur eux (également à l'aide de jQuery).
L' .cliquez sur() propriétés associées fonctionnent très bien lorsque je charge la page directement, mais les boutons ne répondent pas quand je clique dans l'AJAX chargé version.
Depuis que je suis trop pneus à fait expliquer tous les glum que je fais, je suis simplement écrire tout le code ci-dessous, des excuses pour cela. Voici les codes dans les fichiers.
<!-- p11.php -->
<!DOCTYPE html">
<html>
<head>
<title>jQuery</title>
<script type="text/javascript" src="c/js/jquery.js"></script>
<script type="text/javascript" src="c/js/jtry11.js"></script>
<link rel='stylesheet' type='text/css' href='c/css/css11.css'>
</head>
<body>
<button id="go1">Load Something Using AJAX</button>
<div id="msg"></div>
<div id="showButton">
<button id="showLoadedPage">Show the Page</button>
</div>
<div id="results"></div>
</body>
</html>
et la prochaine
$(document).ready(function()
{
$('#results').hide();
$('#msg').hide();
$('#showButton').hide();
$('#loading').hide();
$('#loaded').hide();
$('#load').live('click', function()
{
$('#load').hide();
$('#loading').show();
$('#msg').show('fast');
$.ajax({
url: 'test.html',
cache: false,
success: function(html) {
$('#results').append(html);
}
});
$('#msg').ajaxSuccess(function(evt, request, settings){
$(this).append('Click the Button Below to View the Page');
$('#showButton').show('slow');
$('#hideLoadedPage').hide();
$('#loading').hide();
$('#loaded').show();
});
});
$('#showLoadedPage').live('click', function() {
$('#loaded').hide('slow');
$('#msg').hide('slow');
$('#results').show('fast');
$('.shower').hide();
$(this).hide();
$('#hideLoadedPage').show();
});
$('#hideLoadedPage').live('click', function() {
$('#results').hide('fast');
$('.shower').hide();
$(this).hide();
$('#showLoadedPage').show();
});
$('.hider').live('click', function() {
$('.shower').show();
$(this).hide();
$('p.one').hide('slow');
$('p.two').hide('medium');
$('p.three').hide('fast');
});
$('.shower').live('click', function() {
$('.hider').show();
$(this).hide();
$('p.one').show('slow');
$('p.two').show('medium');
$('p.three').show('fast');
});
$('p.*').live('click', function() {
$(this).hide('slow');
if( $('p').is(':hidden') ) {
$('.shower').show();
}
if( $('p.*').is(':hidden') ) {
$('.hider').show();
}
});
});
et le dernier
<!-- test.html -->
Page Loaded by Ajax.
Not the original Page
<center>
<button class="hider">
<img src="c/images/zoom_out.png" alt="zoom_out" />
Hide 'em
</button>
<button class="shower">
<img src="c/images/zoom_in.png" alt="zoom_out" />
Show it
</button>
<p class="one">Hiya</p>
<p class="two">Such interesting text, eh?</p>
<p class="three">The third Paragraph</p>
</center>
J'espère que je ne suis pas de faire quelques gros temps erreur?
OriginalL'auteur OrangeRind | 2009-09-14
Vous devez vous connecter pour publier un commentaire.
Les sons que vous avez besoin de
$.fn.vivre, comme les gestionnaires d'événements sont enregistrés sur les premiers dom création, et vous êtes repeupler les DOM et ceux qui ne sont pas attachés.
Plus info @ http://docs.jquery.com/Events/live
Pouvez-vous mettre à jour la description de votre code mis à jour, ou de coller un lien direct? Et vous avez pensé à remplacer les tous .cliquez sur gestionnaire des missions qui doivent être renouvelés avec $('selector').live('click', function(){} ); ?
Oui, il Fonctionne maintenant! Merci! La première fois que je l'avait remplacé uniquement dans le bouton aller, mais maintenant, je l'ai fait pour tous. Quelle est exactement la différence entre les deux .cliquez et .live()? est-ce à dire que je peux utiliser .vivre toujours dans la place du clic?
En direct des gestionnaires d'événements, je crois, sont liés au document lui-même à la place de certains éléments, et donc quand l'objet événement est transmis après un événement comme un 'clic' il détecte un élément qui a été cliqué, et intelligemment invoque le droit des gestionnaires d'événements pour leurs événements respectifs/éléments. Vous ne devez utiliser lorsque vous êtes repeupler les DOM avec des éléments tels que dans ce cas, vous ne devriez pas toujours besoin d'elle.
Veuillez vérifier à cette question. stackoverflow.com/questions/1420774/...
OriginalL'auteur meder omuraliev
Si je suis en train de lire ce droit, vous ajoutez les gestionnaires de clic au début. Ces seulement d'incidence sur les boutons. Vous pouvez juste besoin de le changer à un événement en Direct.
OriginalL'auteur Kelly Gendron
sur les cas de travail pour les dom actuel dans votre page et les dom chargé en ajax dans l'avenir
OriginalL'auteur Yene Mulatu