Почему мой код jQuery не умеет читать апостроф?

У меня есть веб-форма, которая автоматически проверяет флажки при загрузке страницы на основе данных, хранящихся в базе данных MYSQL. Все работает отлично, за исключением данных, содержащих апостроф. Вот мой код:Почему мой код jQuery не умеет читать апостроф?

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>

ЭТО НЕ РАБОТАЕТ:

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

источник

2012-04-09 the_boy_za

Это не работает –

Для Levi's результирующий селектор заканчивается "[value='Levi's']". Я думаю, что селекторный двигатель задыхается. Я не уверен, если он поддерживает экранирование (Levi\'s) - если нет, то вы можете сделать что-то вроде

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

вместо этого.

источник

2012-04-09 22:06:01 AKX

Я тестировал его, и он работает! Я немного новичок в jQuery, чтобы быть понятным, что делает ваш код. Код проверяет все флажки ввода, чтобы увидеть, находится ли значение в списке, и если он проверяет флажок на true? –

Да, он выполняет итерацию через все флажки и сравнивает значение, которое вы получаете от JSON, к значению «значение» каждого флажка. Если они совпадают, для этого флажка установлен атрибут «checked». – AKX

Ну вы формируете селектор, обернув Ваше значение в одинарные кавычки. Встроенная одинарная кавычка приведет к тому, что она будет недопустимой селекторной строкой.

редактировать — попробовать это:

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

Кроме того, вы должны (почти наверняка) использовать .prop() вместо .attr(), чтобы установить, если вы используете «проверено» свойство новее, чем 1.6 JQuery:

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

(Нет необходимости устанавливать свойство в строке «проверенного», хотя вы можете, если вам нравится, потому что браузер будет просто бросить его булева так или иначе.)

источник

2012-04-09 22:04:39 Pointy

, почему так важно использовать '.prop()' вместо '.attr()' при использовании 1.6 и выше? –

Существует разница между свойствами элементов DOM (то есть, что вы можете получить по имени, как если бы элементы DOM были объектами JavaScript, 'somthing.name' или' something.tagName' или 'something.onclick' и т. Д.). Ребята jQuery приняли решение четко различать два в 1.6, поэтому почти во всех случаях теперь вы обычно хотите использовать '.prop()', если вы не знаете **, что хотите получить доступ к чему-либо через API-интерфейс атрибута Элемент DOM. – Pointy

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

Когда this.merken = "Levi's", код будет решать это:

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

Вы не можете использовать одинарные кавычки внутри одинарных кавычек. Легко исправить должно быть, чтобы изменить код, чтобы создать двойные кавычки, если вы не будете иметь селектор имени Levi"s :)

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

источник

2012-04-09 22:06:57 lunixbochs

Я тестировал это, и он работает! Ха-ха, я не думаю, что у меня будет входное значение, например 'Levi 's'. При использовании этого метода есть другие специальные символы, которые я должен избегать использовать? –

Правая часть кода должна быть:

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

Это принимает одинарные кавычки, а также двойные кавычки.

источник

2012-04-09 22:19:40

Проблема заключается в апострофе, вам нужно избежать этого.

Вот просто способ сделать это

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

источник

2012-04-09 22:20:46 Starx

Почему мой код jQuery не умеет читать апостроф?

ответ

Смежные вопросы