jquery détection et de suppression d'un élément cliqué

J'ai une hiérarchie des DIVs avec des classes associées, mais pas les Identifiants. Comment puis-je supprimer l'élément cliqué?

<div>
    <div class="minibox" onclick="remove_me()">Box1</div>
    <div class="minibox" onclick="remove_me()">Box1</div>
    <div class="minibox" onclick="remove_me()">Box1</div>
    <div class="minibox" onclick="remove_me()">Box1</div>
    <div class="minibox" onclick="remove_me()">Box1</div>
</div>
<script>
    function remove_me(){
    ///remove the clicked div
    }
</script>
InformationsquelleAutor Shahid Karimi | 2011-03-14
  1. 16
    $('div .minibox').click(function(e){
    $(e.target).remove();
});
    InformationsquelleAutor gion_13
  2. 6
    $('.minibox').click(function() { $(this).remove(); });
    InformationsquelleAutor JaredMcAteer
  3. 2

    À l'intérieur de l'jQuery document.prêt() événement, vous avez besoin de lier un gestionnaire de clic sur le div's

    $(document).ready(function() {
    $('.minibox').click(function(e){
        $(this).remove();
    });
});

    Découvrez jQuery remove() et cliquez sur().

    La this dans le gestionnaire d'événement fait référence à l'élément qui a été cliqué.

    InformationsquelleAutor Geoff Appleford
  4. 2

    Changement

     <div class="minibox" onclick="remove_me()">Box1</div>

    à

     <div class="minibox" onclick="remove_me(this)">Box1</div>

    ensuite utiliser

    <script>
 function remove_me(elm){
   $(elm).remove();
}
</script>
    InformationsquelleAutor Martin Jespersen
  5. 1
    $(document).ready(function() {
  $('.minibox').click(function () {
    $(this).remove();
  });
});

    Découvrez remove().

    InformationsquelleAutor Kon
  6. 1

    Si vous pouvez utiliser jQuery pour inscrire votre événement c'est aussi simple que:

    $(".minibox").click(function(){
   $(this).remove();
});

    Exemple de Code sur jsfiddle.

    InformationsquelleAutor Mark Coleman
  7. 1

    votre code html:

    <div class="box">some content</div>
<div class="box">some content</div>
<div class="box">some content</div>
<div class="box">some content</div>
ect...

    votre jQuery

    $(function(){ //make sure your DOM is ready
$("div.box").click(function(){ //bind click on every div that has the class box
  $(this).remove(); //remove the clicked element from the dom
});
});

    Démo avec fadeOut animation:
    http://jsfiddle.net/qJHyL/1/ (et de fantaisie icône de suppression)

    InformationsquelleAutor meo
  8. 1
    <div class="box">Box 1</div>
<div class="box">Box 2</div>
<div class="box">Box 3</div>
<div class="box">Box 4</div>
<div class="box">Box 5</div>

    alors vous devez utiliser

    $(".box").bind("click", function() {

  $(this).fadeOut(500, function() { 
    //now that the fade completed
    $(this).remove(); 
  });

});

    Exemple dans JSBIN

    • pourquoi .fadeIn() ??
    • fadeIn était une faute de frappe, c'est fadeOut et ajout d'un exemple, la proposition est de donner une belle enlever l'effet, de sorte qu'il n'a pas simplement "disparu" ... c'est tout sur les techniques d'INTERFACE utilisateur, j'ai l'habitude de permettre aux utilisateurs de savoir ce qu'il se passe et je ne ferai jamais quelque chose comme la disparition d'un div / tableau ligne / autre élément sans un effet simple de disparition.
    • Assurez-vous de moi. Jetez un oeil à mon exemple. L'utilisateur doit savoir ce qui va se passer avant qu'il clique. Mais fadeOut serait plus looke comme supprimer pour moi 😉 au moins de la supprimer dans le rappel. Dans votre exemple, l'animation de fondu n'aura pas le temps de finir brefore l'élément va être supprimé.
    • bind est obsolète, utiliser sur.
    InformationsquelleAutor balexandre