tutorials.de Buch-Aktion 05/2012
ERLEDIGT
NEIN
ANTWORTEN
1
ZUGRIFFE
1967
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. #1
    Kristian Tutorials.de Gastzugang
    Hi, ihr seid (mal wieder) meine letzte Hoffnung.

    Und zwar habe ich diesen Quellcode (den ich leider als nicht registrierter User nicht formatieren kann):

    <script src="http://code.jquery.com/jquery-latest.js"></script>

    $(function() {
    $("#showbox").click(function() {
    $("#box").slideToggle(300);
    });
    });

    <a href="#" id="showbox" class="minimize" title="Die Angebotbeschreibung ausblenden.">Ausblenden 1</a>
    <div id="box">Text 1 und so!</div><br />

    <a href="#" id="showbox" class="minimize" title="Die Angebotbeschreibung ausblenden.">Ausblenden 2</a>
    <div id="box">Text 2 und so!</div>

    Nun generiere ich aber mit PHP reichlich "showboxen" einer unterschiedlichen Anzahl, wie löse ich das Problem geschickt? Hat JQuery da auch schon etwas "Fertiges"?
    Oder muss ich uncool eine JavaSchleife einbauen? Ich kenne mich leider nicht allzu gut in Javascript aus, also wäre es klasse, wenn jemand eine Idee hätte!

    Dankööö

    Edit: Bis jetzt ist es ja leider so, dass nur die erste Box geöffnet/geschlossen wird.

    Ich dachte man könnte an die id="showbox" einfach eine Nummer anhängen, damit js weiß, welche Showbox/Box gemeint ist. Aber wie bringt man das dem JS bei?
     

  2. #2
    Quaese Quaese ist offline Moderator
    tutorials.de Moderator
    Registriert seit
    Feb 2004
    Beiträge
    3.451
    Hi,

    IDs müssen innerhalb eines Dokuments eindeutig sein. Aus diesem Grund solltest du die Elemente mit Klassen versehen und darüber ansprechen.

    Wenn du die zugehörige HTML-Passage entsprechend anpasst,
    Code :
    1
    2
    3
    4
    5
    
    [B]<div>[/B]<a href="#" [B]class[/B]="showbox" class="minimize" title="Die Angebotbeschreibung ausblenden.">Ausblenden 1</a>
    <div [B]class[/B]="box">Text 1 und so!</div><br />[B]</div>[/B]
    [B]
    <div>[/B]<a href="#" [B]class[/B]="showbox" class="minimize" title="Die Angebotbeschreibung ausblenden.">Ausblenden 2</a>
    <div [B]class[/B]="box">Text 2 und so!</div>[B]</div>[/B]
    sollte folgendes Code-Fragment das Gewünschte ausführen.
    Code :
    1
    2
    3
    4
    5
    
    $(function(){
      $(".showbox").click(function(){
        $(this).parent().find(".box").slideToggle(300);
      });
    });

    Ciao
    Quaese
     
    Vielleicht muss man manchmal vom Weg abkommen, um nicht auf der Strecke zu bleiben!
    ----
    Der "Fortsetzungsroman" auf www.leuteforum.de

    New kind to realize large scalable projects with jQuery: jQuery SDK

Ähnliche Themen

  1. Divs verschieben mit jQuery - Framesetnachahmung
    Von deluxeondecks im Forum Javascript & Ajax
    Antworten: 3
    Letzter Beitrag: 10.01.11, 09:43
  2. [jQuery] Drag mehrere Divs
    Von sub7even im Forum Javascript & Ajax
    Antworten: 0
    Letzter Beitrag: 04.09.10, 20:29
  3. jquery DIVs drehen
    Von DiDiJo im Forum Javascript & Ajax
    Antworten: 8
    Letzter Beitrag: 13.08.10, 18:13
  4. jQuery: Mehrere Divs hintereinander einblenden
    Von DiDiJo im Forum Javascript & Ajax
    Antworten: 6
    Letzter Beitrag: 16.07.10, 20:31
  5. [jQuery] Drag & Drop & Img & Divs
    Von newwarrior im Forum Javascript & Ajax
    Antworten: 5
    Letzter Beitrag: 09.03.10, 23:40