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:



    Dies ist der "Button":


    Code
    1. <a href=\"#\" onclick='showText();'>Open</a>


    Und dies der <div>-Container:


    Code
    1. <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

  • Code
    1. function showText(irgendeineuserid) {
    2. var spoiler = document.getElementById(irgendeineuserid);
    3. if (spoiler.style.display == 'block') {
    4. spoiler.style.display='none';
    5. } else {
    6. spoiler.style.display='block';
    7. }
    8. return false;
    9. }


    dann musste nur noch beim generieren des quelltextes die user-id vergeben und den ganzen scheiss aufrufen durch

    Code
    1. <a href=\"#\" onclick='showText("deineuserid");'>Open</a>


    oder

    HTML
    1. <a href=\"javascript:showText('deineuserid');\" >Open</a>


    is ungetestet, aber so sollte es fruchten

  • Hmm klingt logisch aber mal doof gefragt:


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


    Code
    1. var id = <? echo $list[id]; ?>;


    die ID in eine JS Variable definieren nur wie bekomm ich die schon bei der function rein?

  • 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?

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



    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...

  • Ahso sry....


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


    Code
    1. echo "<div class='usr'>";
    2. 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>";
    3. echo "<div class='status'>";
    4. echo "<img src=\"lib/img/icons/gold.png\" title='Gold'> $list[gold]";
    5. echo "</div></div>";
  • 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 :