Избегание апострофов в JavaScript, сгенерированном из PHP

Question

Я пытаюсь получить текстовое поле с начальным значением, где, если вы щелкнете по нему, текст исчезнет, ​​и если вы нажмете, прежде чем что-либо было введено, начальное значение вернется так же, как поле поиска на Yahoo ответы и многие другие сайты.

echo "<input type=\"text\" 
onblur=\"if (this.value == '') {this.value = '$cleaned';}\" 
onfocus=\"if (this.value == '$cleaned') {this.value = '';}\" 
value=\"$cleaned\" />\n";

У меня есть переменная php $cleaned в качестве начального значения. Этот код работает, за исключением случая, когда очищенная переменная содержит апостроф, например $cleaned = "FRIEND'S". Тогда код будет читать this.value = 'FRIEND'S' и апостроф в FRIEND'S рано завершает строку.

Я пытался использовать html-сущности, экранировать апостроф и использовать экранированные кавычки и не могу заставить это дело работать. Единственное решение, которое у меня есть, - заменить апострофы символами, похожими на апострофы.

Кто-нибудь знает, как справиться с этим делом?

Answer 1

Используйте json_encode для кодирования данных для использования в JavaScript и htmlspecialchars для кодирования строки, которая будет использоваться в значении атрибута HTML:

echo '<input type="text"
onblur="'.htmlspecialchars("if (this.value == '') {this.value = ".json_encode($cleaned).";}").'" 
onfocus="'.htmlspecialchars("if (this.value == ".json_encode($cleaned).") {this.value = '';}").'"
value="'.htmlspecialchars($cleaned).' />'."\n";

Но использовать defaultValue, безусловно, проще:

echo '<input type="text"
onblur="'.htmlspecialchars("if (this.value == '') {this.value = defaultValue;}").'" 
onfocus="'.htmlspecialchars("if (this.value == defaultValue) {this.value = '';}").'"
value="'.htmlspecialchars($cleaned).'" />'."\n";

Answer 2

Сначала сгенерируйте чистый код JavaScript.Вы можете создать действительные значения JavaScript, используя json_encode , например:

$js = 'if (this.value == '.json_encode($cleaned).') {this.value = "";}';

Затем сгенерируйте HTML.Вы можете кодировать все атрибуты HTML, включая те, которые содержат встроенный код JavaScript, используя htmlspecialchars , например:

echo '<input type="text" onblur="'.htmlspecialchars($js).'" />';

Answer 3

Как насчет этого

echo '<input type="text" 
onblur="if (this.value == "") {this.value = "' . $cleaned . '";}" 
onfocus="if (this.value == "' . $cleaned . '") {this.value = "";}" 
value="' . $cleaned . '" />\n';