2017-08-13 14 views
0

aujourd'hui tout en travaillant avec la méthode $ .ajax de la bibliothèque JQuery et le chargement des données d'une page basée sur PHP j'ai trouvé un problème en essayant de joindre certains événements.Chargement des données avec Ajax ne me laisse pas ajouter JavaScript Événements

J'ai un document html comme ça:

<html> 

<script src="/public_html/assets/js/jquery/jquery-3.2.1.min.js"></script> 

.container { 

    display: block; 
    width: 500px; 
    height: 500px; 
    background: red; 

} 

<!-- Here goes the container --> 

<div class='wrapper'></div> 

<script> 

    $(document).ready(function() { 

    $(".container").on("contextmenu", function (event) { 

    event.preventDefault(); 

    alert("It works."); 

    }); 

    $.post("example.php", function(result) { 

    $(".wrapper").html(result); 

    }); 


    }); 

</script> 

Lorsque, à la fin de la page il y a la requête Ajax à ce fichier PHP:

echo "<div class='container'>";echo "</div>"; 

Lorsque la requête se termine, le conteneur apparaît mais lorsque vous essayez de le contecter, il ne fonctionne pas. Cependant, si c'est fait par le HTML brut, cela fonctionne. Toute façon de résoudre cela?

+0

Utiliser '$ (function() {})'? – guest271314

+0

Semble ne pas fonctionner. – Weyooo

+0

Enveloppez-vous tout le code dans '$ (function() {})'? Quel est le but de '$ (" "). Html (résultat);'? – guest271314

Répondre

0

Utiliser event delegation si l'élément ayant .className"container" est ajouté à document après documentDOMContentLoaded ou windowload événement

$(function() { 
    $(document).on("contextmenu", ".container", function(event) { 
    // do stuff 
    }) 
})