jq-show&hide mehrerer unterschiedlicher divs

[Marcus-24-D]

Sorry das ich damit nerven muss

Habe folgendes JQuery welches mir einen div nach mouseour und over ein und ausblendet.

$(document).ready(function () {

  $("#eintrag").mouseenter(function(){
    $("#del").show(); 
  });

  $("#del, #eintrag").mouseleave(function(){
    $("#del").hide(); 
  });
});

Damit wollte ich erreichen das ich wie bei facebook das lösch x ein und ausblenden kann wenn ich mit der Maus darüber fahre bzw rausfahre.
Bis mir dann eingefallen ist, das ich ja jedem div eine id geben müsste.
Demnach müsste ich ja das JS auch doppelt und dreifach nur immer anders benannt dazugeben damit ich die unterschiedlichen divs ein und ausblenden kann. Ich kann doch jetzt nicht bei angenommen 50 beiträgen das JQ so oft in den quelltext geben damit ich jedes div anspreche.
Könnt ihr mir nochmal etwas unter die Arme greifen bütte

[Marcus-24-D]

niemand kann helfen?

[AmicaNoctis]

Hallo,

du kannst doch beim Laden der Seite über alle diese divs iterieren und jedem die beiden Events zuordnen. Oder du hängst die Events an den Elterncontainer und greifst in der Handler-Funktion auf das eventauslösende Kind zu.

Gruß,

Amica

[onemorenerd]

Machs mit Klassen ...

<style type="text/css">
/* initial alle mouseover-actions verstecken */
.mo-action { display: none; }
</style>
<div class="deletable">
    <div class="mo-action delete">x</div>
    <!-- hier ein Eintrag -->
</div>
<div class="deletable">
    <div class="mo-action delete">x</div>
    <!-- hier ein weiterer Eintrag -->
</div>

Jetzt genügt einmalig der Javascript-Code, der nun natürlich über die Klassen alle Elemente findet und ihnen das gewünschte Verhalten anhängt.
Im Eventhandler ist this eine Referenz auf das DOM-Element, welches den Event erfahren hat. Du kannst also ausgehend von diesem Element das dazugehörige DIV selektieren.

$(document).ready(function(){
    $('.deletable').mouseover(function(){
        $(this).find('.mo-action').show();
    });
    $('.deletable').mouseout(function(){
        $(this).find('.mo-action').hide();
    });

    // und damit auch was passiert:
    $('.deletable > .delete').click(function(){
        var entry = $(this).parent();
        entry.remove();    // etc.
    });
});

[Marcus-24-D]

oh, ihr seid ja klasse. dankeschön, das werd ich mir ma genauer betrachten.
das $(this) unterscheidet also in diesem fall die selektierten elemente?

[wahsaga]

das $(this) unterscheidet also in diesem fall die selektierten elemente?

Das ist das Element, auf dem der Event jeweils auftrat.

Du solltest dich wirklich mit den Grundlagen von jQuery auseinandersetzen, wenn du es benutzen willst!

[Marcus-24-D]

ok, hast du da gute einfach zu verstehende links für einsteiger für mich ?
hab schon viel gelesen, aber vieles ist sau kompliziert erklärt