Warum kann mein jQuery-Code kein Apostroph lesen?

Question

Ich habe ein Webformular, das die Checkboxen beim Laden der Seite automatisch anhand der in der MYSQL-Datenbank gespeicherten Daten überprüft. Alles funktioniert gut mit Ausnahme von Daten, die einen Apostroph enthalten. Hier ist mein Code:

JSON:

[{"pkFavorietemerken":"1","merken":"Adidas"},{"pkFavorietemerken":"2","merken":"Boss"},{"pkFavorietemerken":"3","merken":"Burberry"},{"pkFavorietemerken":"4","merken":"Christian Dior"},{"pkFavorietemerken":"5","merken":"D&G"},{"pkFavorietemerken":"6","merken":"Diesel"},{"pkFavorietemerken":"7","merken":"Dolce & Gabanna"},{"pkFavorietemerken":"8","merken":"Emporio Armani"}] 

JQUERY:

$.getJSON("jason.php", function(data) { 

     $.each(data, function(){ 


    $("[value='" + this.merken + "']").attr("checked","checked"); 


     }); 

    }); 

HTML:

<form name="form1" method="post" action="something.php">       
    <ul> 
     <li><input type="checkbox" name="merk[]" value="Adidas"/>Adidas</li> 
     <li><input type="checkbox" name="merk[]" value="Airforce"/>Airforce</li> 
     <li><input type="checkbox" name="merk[]" value="Armani"/>Armani</li> 
     <li><input type="checkbox" name="merk[]" value="Asics"/>Asics</li> 
     <li><input type="checkbox" name="merk[]" value="Bikkemberg"/>Bikkemberg</li> 
     <li><input type="checkbox" name="merk[]" value="Bjorn Borg"/>Bjorn Borg</li> 
     <li><input type="checkbox" name="merk[]" value="BlueBlood"/>BlueBlood</li> 
     <li><input type="checkbox" name="merk[]" value="Boss"/>Boss</li> 
     <li><input type="checkbox" name="merk[]" value="Brunotti"/>Brunotti</li> 
     <li><input type="checkbox" name="merk[]" value="Burberry"/>Burberry</li> 
    </ul> 

funktioniert das nicht:

<li><input type="checkbox" name="merk[]" value="Levi's"/>Levi's</li> 

Answer 1

Für Levi's lautet der resultierende Selektor "[value='Levi's']". Ich schätze, der Wählmotor drosselt darauf. Ich bin mir nicht sicher, ob es zu entkommen unterstützt (Levi\'s) - wenn dies nicht der Fall, können Sie so etwas wie

var merken = this.merken; 
$("input:checkbox").each(function(){ 
    if(this.value == merken) this.checked = true; 
}); 

stattdessen tun können.

Answer 2

Nun, Sie durch Umwickeln Sie den Wert in einfache Anführungszeichen einen Selektor bilden. Das eingebettete einfache Anführungszeichen wird dazu führen, dass es eine ungültige Auswahlzeichenfolge ist.

I denke, es wird funktionieren, um sicherzustellen, dass eingebettete einfache Anführungszeichen mit einem umgekehrten Schrägstrich zitiert werden, aber ich muss es versuchen.

bearbeiten — versuchen Sie dies:

$("[value='" + this.merken.replace(/'/g, "\\'") + "']").attr("checked","checked"); 

Außerdem sollten Sie (fast sicher) .prop() statt .attr() verwendet werden, die festlegen Eigenschaft „geprüft“, wenn Sie ein mit neueren-als-1.6 jQuery:

$("[value='" + this.merken.replace(/'/g, "\\'") + "']").prop("checked", true); 

(Keine Notwendigkeit, das Eigentum an den String „geprüft“ zu setzen, wenn Sie können, wenn Sie mögen, weil der Browser es nur gegossen wird sowieso boolean.)

Answer 3

$("[value='" + this.merken + "']").attr("checked","checked"); 

Wenn this.merken = "Levi's", wird der Code auf dieses Problem zu beheben:

$("[value='Levi's']").attr("checked","checked"); 

Sie können nicht ein einziges Zitat in einfache Anführungszeichen verwenden. Eine einfache Lösung soll Ihren Code zu ändern sein, um doppelte Anführungszeichen, so lange zu erstellen, wie Sie keinen Wähler Levi"s :)

genannt haben

$('[value="' + this.merken + '"]').attr("checked","checked"); 

Answer 4

Das richtige Stück Code sein sollte:

$('[value="' + this.merken.replace('"','\"') + '"]').attr("checked","checked"); 

Dies akzeptiert sowohl einfache Anführungszeichen als auch doppelte Anführungszeichen.

Answer 5

Das Problem ist der Apostroph, Sie müssen ihm entkommen.

Hier ist eine einfach Art und Weise so

function addslashes(str) { 
    return (str+'').replace(/([\\"'])/g, "\\$1").replace(/\0/g, "\\0"); 
} 
$("[value='" + addslashes(this.merken) + "']").attr("checked","checked");