Ergebnis 1 bis 8 von 8

Thema: JavaScript - Text ein und ausblenden...

  1. #1
    Youngster
    Registriert seit
    26.10.2012
    Beiträge
    15
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard JavaScript - Text ein und ausblenden...

    Hallo,

    ich wollte für ein "kleines" Projekt eine Funktion in meinem Chat einbauen,
    mit der man einen bestimmten Text an der "User-Online"-Liste mit einem
    Button per Klick ein- und ausblenden kann.

    Das Problem ist, dass dieses Script einen feste Definition nutzt.

    Sprich: Wenn zwei oder mehr User online sind, und ich klicke auf den
    Button, wird nicht der Text vom ausgewählten User geöffnet sondern
    von dem ersten User im Chat da jeder <div>-Container die gleiche ID
    nutzt.

    (Hoffe es ist verständlich).

    Wie kann ich meinem Script jetzt sagen, dass der <div>-Container bei
    jedem User eine andere ID nutzt? Hier mal das JavaScript:

    Code:
    function showText() {        
            var spoiler = document.getElementById('spoiler');
     
            if (spoiler.style.display == 'block') {
               spoiler.style.display='none';
            } else {
     
              spoiler.style.display='block';
             }
            return false;
       }
    Dies ist der "Button":

    Code:
    <a href=\"#\" onclick='showText();'>Open</a>
    Und dies der <div>-Container:

    Code:
    <div id='spoiler'>
    Wie und wo muss ich etwas ändern, damit es auch nur den <div>
    vom ausgewählten User öffnet und nicht bei dem ersten weil jede
    <div id> den selben Wert hat?

    //EDIT:
    Habe schon überlegt die User ID von PHP zu JavaScript zu übertragen.
    Funktioniert auch nur wie definiere ich diese ID jetzt für den einzelnen
    <div>-Container? Irgendwie bin ich gerade Brain-AFK um das umzusetzen... X_x
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!
    Geändert von Pelix (27.09.2013 um 15:07 Uhr)

  2. #2
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: JavaScript - Text ein und ausblenden...

    Code:
    function showText(irgendeineuserid) {                
     var spoiler = document.getElementById(irgendeineuserid);           
    if (spoiler.style.display == 'block') {          
      spoiler.style.display='none';         
    } else {            
     spoiler.style.display='block';       
       }        
     return false;   
     }
    dann musste nur noch beim generieren des quelltextes die user-id vergeben und den ganzen scheiss aufrufen durch
    Code:
    <a href=\"#\" onclick='showText("deineuserid");'>Open</a>
    oder
    HTML-Code:
    <a href=\"javascript:showText('deineuserid');\" >Open</a>
    is ungetestet, aber so sollte es fruchten
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  3. #3
    Youngster
    Themenstarter

    Registriert seit
    26.10.2012
    Beiträge
    15
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: JavaScript - Text ein und ausblenden...

    Hmm klingt logisch aber mal doof gefragt:

    Wie bekomm ich denn in "function showText(irgendeineuserid) {" eine ID? ich kann ja mit z.B.

    Code:
    var id = <? echo $list[id]; ?>;
    die ID in eine JS Variable definieren nur wie bekomm ich die schon bei der function rein?

  4. #4
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: JavaScript - Text ein und ausblenden...

    also ich würd sowas unobstrusive mit jquery machen.
    aber dafür müsste ich den code sehen mit dem link und dem anderen gedöhnse.
    eigentlich erzeugst du den code aber in einer schleife serverseitig und in der schleife haste dann ja auch die id parat oder nicht?
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  5. #5
    Youngster
    Themenstarter

    Registriert seit
    26.10.2012
    Beiträge
    15
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: JavaScript - Text ein und ausblenden...

    Also mit jquery hatte ich mir auch schon überlegt .... das würde dann ungefähr so aussehen:

    Code:
    $(document).ready(){
    
    $('.usr img').click(function(){
        if($(this).next('.status').css('display') == 'block'){
            $(this).next('.status').slideUp(200);
        }else{
            $(this).next('.status').slideDown(200);
        }
    })
    
    
    }
    Nur wie sage ich dem Bild auf das ich klick jetzt, dass es die Funktion starten soll?
    Wenn man auf das Bild klickt passiert nix...

  6. #6
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: JavaScript - Text ein und ausblenden...

    nen krümel html wäre hilfreich
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  7. #7
    Youngster
    Themenstarter

    Registriert seit
    26.10.2012
    Beiträge
    15
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: JavaScript - Text ein und ausblenden...

    Ahso sry....

    Damit es etwas übersichtlicher ist hab ich das mal in 5 echos verpackt

    Code:
    echo "<div class='usr'>";        
    echo "<a href=\"#\" onclick=\"return profile('profile.php?usr=$list[id]')\">$list[username]</a><span style=\"float:right;\">$kick $ban $admin $pm <img src=\"lib/img/icons/status.png\"></span>";
    echo "<div class='status'>";
    echo "<img src=\"lib/img/icons/gold.png\" title='Gold'> $list[gold]";
    echo "</div></div>";

  8. #8
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: JavaScript - Text ein und ausblenden...

    ok also du hast zwei image-tags, auf beide würdest du aktuell die click-action legen.
    sprich nicht nur auf das status.png
    dann empfehle ich dir von anfang an dran zu denken deine objekte in variablen zu speichern, denn jedes mal nen selektor bedeutet jedes mal speicher und zeit.
    so nun zu deinem problem

    wenn du etwas nur auf das status.png legen willst musste entweder über first() das img holen oder du gibst dem ding ne klasse und gehst via img.DEINEKLASSE im selektor an das teil dran.
    dann würde ich mir überlegen wann genau die weitere funktion ausgeführt werden soll.
    da ich auf eine reihenfolge statt gleicher abfolge stehe, würde ich die funktion selber im callback vom slideDown ausführen lassen.

    genau genommen machst du aber das verstecken und anzeigen mit der funktion und jquery schon richtig

    so wäre der code etwas sauberer :
    Code:
    $(document).ready(){
        $('div.usr img').first().click(function(){
            var statusdiv = $(this).next('div.status');
            if(statusdiv.css('display') == 'block'){
                statusdiv.slideUp(200); // den status verstecken
            }else{
                statusdiv.slideDown(200, function(){ //status verstecken und danach was anderes mächtiges tun
                    //do other magic stuff
                });
            }
        })
    }
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

Ähnliche Themen

  1. Wiki: Text ein/ausblenden lassen
    Von yngvar im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 2
    Letzter Beitrag: 05.03.2008, 12:09
  2. Via Javascript Text an Cursorposition kopieren
    Von gelöschter User im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 0
    Letzter Beitrag: 06.02.2008, 16:53
  3. Javascript mit if-Abfrage Bereich ausblenden
    Von schneebi12 im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 5
    Letzter Beitrag: 23.01.2008, 15:01
  4. Text "ausblenden"
    Von M!chael im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 02.02.2007, 22:30
  5. javascript text include
    Von Yada im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 1
    Letzter Beitrag: 11.12.2004, 17:38

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •