Jquery Toggle mit PHP-Variable funktioniert nicht

Question

Ich habe diese Umschaltfunktion, um ein Listenelement sichtbar und unsichtbar zu machen. Ohne die Variable ID funktioniert es (nur die erste öffnet natürlich). Aber mit der Variable funktioniert es überhaupt nicht. Die Variable ist nur eine Zahl, die der Listenelement-ID hinzugefügt wird, die im HTML-Code gut angezeigt wird. Diese ist die Funktion, die ich habe:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
<script> 
$("#button-" . $row['id'] . "").click(function() { 
$("#bands-" . $row['id'] . "").toggle(); 
}); 
</script> 
<?php 
echo "<a id='button-" . $row['id'] . "'>bands</a>"; 

echo "<li id='bands-" . $row['id'] . "' class='clearfix list-group-item' style='display: none;'></li>"; 
?> 

(auf jede Zeile Echo ist ein bisschen hässlich, ich weiß, aber es funktioniert :-P)

Answer 1

Ihre Schnur auf JS Seite zu entkommen falsch ist, die Ruhe sollte gut funktionieren. Auf der PHP-Seite war es korrekt, weil Sie in einer Zeichenfolge von echo sind.

$("#button-<?php echo $row['id']; ?>").click(function() { 
    $("#bands-<?php echo $row['id']; ?>").toggle(); 
}); 

Answer 2

Statt JavaScript-Code für jede Zeile zu erzeugen, sollten Sie es einmal schreiben und das data-id Attribut den entsprechenden Eintrag zu finden.

Ihr JavaScript sollte wie folgt aussehen:

$(document).on("click", ".bands-button", function() { 
    $("#bands-"+$(this).data("id")).toggle(); 
}); 

Und in Ihrem PHP-Code, den Sie Ihre Zeilen-ID innerhalb des Attributs data-id setzen statt id Attribut:

echo "<a class='bands-button' data-id='" . $row['id'] . "'>bands</a>"; 
echo "<li id='bands-" . $row['id'] . "' class='clearfix list-group-item' style='display: none;'></li>";