Wie man nur vorgewähltes Element css

Question

ändert Ich habe Produkttabelle, es lädt unterschiedliche HTML-Seite nach Produkt-ID. Jetzt möchte ich die ausgewählte (durch ein Element ausgewählte) Tabellenzeile hervorheben. Ich benutze eine Funktion, um zu wissen, welche eindeutige ID sie hat.

function Tooted(str) { 
     var url="tooted.php?q="+str; 
     if (str == "") { 
      $("#txtHint").html(""); 
      return; 
     } else { 
      $("#txtHint").load(url); 
     } 



    $("#tellimus"+str).on('click',function(){ 
     if(str!=str){ 

     $(this).css({'background-color':'white'}) 
    } 
    else{$(this).css({'background-color':'#6495ED'})} 
     }); 

    } 

Es öffnet sich das ausgewählte HTML-Seite wie diese

<td>'.$r["id"].' <a id="link" nohref style="cursor:pointer;" onClick="Tooted(\''.$r["id"].'\')">Tooted</a></td> 

ich jede Zeile durch eindeutige ID wie diese Auswahl:

<tr class="tellimuz" id=tellimus'.$r["id"].'> 

Voll PHP/HTML-Code:

$out .= "\n".'<tr class="tellimuz" id=tellimus'.$r["id"].'> 
    <td>'.$r["id"].' <a id="link" nohref style="cursor:pointer;" onClick="Tooted(\''.$r["id"].'\')">Tooted</a></td> 
    <td>'.$r["kp"].'</td> 
    </tr>'; 

Nun, wie ich schon sagte, wollte ich die markieren Tabellenzeile, was nach Funktion ausgewählt ist. Die Hintergrundfarbe-Änderung funktioniert, ABER ich möchte nur die ausgewählte Zeile markieren. Atm jede ausgewählte Zeile ändert Hintergrundfarbe und dosent ändert es zurück zu weiß, wenn es nicht ausgewählt ist

Answer 1

Sie scheinen eine schließende Klammer für Ihre "Tooted" -Funktion in Ihrem Javascript zu fehlen.

Sie haben die gleiche ID ("link") für jedes Anker-Tag.

Sie haben (str!=str) in Ihrem Code. Sie vergleichen eine Variable selbst, das wird IMMER sich selbst gleich sein, so hier ist es immer, IMMERfalse

Was ist Ihre Funktion tatsächlich tut:

Wenn Sie auf ein Link, der in HTML zu Ihrem #txtHint Element geladen wird. Sie binden dann eine andere Funktion an das Klickereignis für die gesamte Zeile, die im Wesentlichen die Hintergrundfarbe wechselt.

Was (glaube ich) du versuchst zu tun, ist eine Zeile zu deiner hervorgehobenen Hintergrundfarbe zu ändern, und der Rest zu weiß. Anstatt wie oben beschrieben einen Ein-Element-Schalter zu verwenden, müssen Sie einen zu der hervorgehobenen Farbe und den Rest zu Weiß ändern.

function Tooted(str){ 
    var url = "tooted.php?q="+str; 
    if (str == "") { 
    $("#txtHint").html(""); 
    return; 
    } else { 
    $("#txtHint").load(url); 
    } 

    //no need to get fancy with IDs, just get closest parent row 
    $(this).closest("tr") 
    //change this row to your highlight color 
    .css({'background-color':'#6495ED'}) 
    //then get all the other rows and make them white 
    .siblings("tr").css({'background-color':'white'}) 
} 

Wenn ich falsch vermute, bitte klären Sie Ihre Frage. Ihr gerenderter HTML-Code wäre sehr hilfreich.