Как избежать двойных кавычек в атрибуте заголовка

195

Я пытаюсь использовать строку, которая содержит двойные кавычки в атрибуте заголовка якоря. Пока я попробовал это:

<a href=".." title="Some \"text\"">Some text</a>
<!-- The title looks like `Some \` --!>

и

<a href=".." title="Some &quot;text&quot;">Some text</a>
<!-- The title looks like `Some ` --!>

Обратите внимание, что использование одинарных кавычек не вариант.

html escaping quotes harpax
источник
18
@ Хаим, прочитайте вопрос… там написано: «одинарные кавычки - это не вариант».
Нильс Ридеманн
2
@harpax - мне было просто любопытно, почему одиночные кавычки не вариант?
Берт Ф
3
Одиночные кавычки не являются действительными HTML.
скайфут
1
Ваш второй пример должен работать абсолютно идеально. В каком браузере вы видите проблему?
Олли Ходжсон
1
@harpax: может быть, вы должны уточнить условие «одинарные кавычки - это не вариант». Я бы предположил, что использование одинарных кавычек «внутри» строки не является опцией (отображаемой для пользователя), а просто переворачивает одинарные и двойные кавычки, как показывал Хаим выше, будет в порядке.
Christian.K

Ответы:

284

Этот вариант - 

<a title="Some &quot;text&quot;">Hover me</a>
Развернуть фрагмент

Правильно и работает как положено - вы видите нормальные кавычки на отображаемой странице.

Марис Киселовс
источник
Ага. <a href="#" title="Foo &quot;Bar&quot;">Testing</a>и <a href="#" title="Smart quotes &#8221;Bar&#8220;">Testing too</a>работать на меня.
Олли Ходжсон
5
@Maris: Ну ... я не вижу нормальных кавычек на отображаемой странице, когда создаю & quot; (Firefox, Chrome). Зачем?
Кшиштоф Тшос
@Maris, та же проблема здесь. Смотрите текст "& quot;" появляются в IE и Chrome, когда пользователь наводит курсор на элемент.
rstackhouse
Удивительно работал с html-контентом, встроенным в атрибут (для javascript для создания редактируемой текстовой области):data-editable-note="<?php echo str_replace('"', '&quot;', $note); ?>"><?php echo mark::up($note); ?></div>
WEBjuju
23

Вот фрагмент экранирующих символов HTML, взятых из кэшированной страницы на archive.org :

&#060   |   less than sign  <       
&#064   |   at sign @       
&#093   |   right bracket   ]       
&#123   |   left curly brace    {       
&#125   |   right curly brace   }       
&#133   |   ellipsis    …       
&#135   |   double dagger   ‡       
&#146   |   right single quote  ’       
&#148   |   right double quote  ”       
&#150   |   short dash  –       
&#153   |   trademark   ™       
&#162   |   cent sign   ¢       
&#165   |   yen sign    ¥       
&#169   |   copyright sign  ©       
&#172   |   logical not sign    ¬       
&#176   |   degree sign °       
&#178   |   superscript 2   ²       
&#185   |   superscript 1   ¹       
&#188   |   fraction 1/4    ¼       
&#190   |   fraction 3/4    ¾       
&#247   |   division sign   ÷       
&#8221  |   right double quote  ”       
&#062   |   greater than sign   >   
&#091   |   left bracket    [   
&#096   |   back apostrophe `   
&#124   |   vertical bar    |   
&#126   |   tilde   ~   
&#134   |   dagger  †   
&#145   |   left single quote   ‘       
&#147   |   left double quote   “   
&#149   |   bullet  •   
&#151   |   longer dash —   
&#161   |   inverted exclamation point  ¡   
&#163   |   pound sign  £   
&#166   |   broken vertical bar ¦   
&#171   |   double left than sign   «   
&#174   |   registered trademark sign   ®   
&#177   |   plus or minus sign  ±   
&#179   |   superscript 3   ³   
&#187   |   double greater-than sign    »   
&#189   |   fraction 1/2    ½   
&#191   |   inverted question mark  ¿   
&#8220  |   left double quote   “   
&#8212  |   dash    —
Дейв
источник
9

Экранирующий код &#34;также можно использовать вместо &quot;.

fredley
источник
3

Использование &quot;это способ сделать это. Я попробовал ваш второй фрагмент кода, и он работает как в Firefox, так и в Internet Explorer.

TheCee
источник
2

Он может работать с любым символом из списка символов HTML Escape , но у меня была та же проблема с проектом Java. Я использовал StringEscapeUtils.escapeHTML("Testing \" <br> <p>")и название было<a href=".." title="Test&quot; &lt;br&gt; &lt;p&gt;">Testing</a> .

Это работало только для меня, когда я изменил StringEscapeUtils на, StringEscapeUtils.escapeJavascript("Testing \" <br> <p>")и это работало в каждом браузере.

Родриго Орта
источник
На мой взгляд, лучшее решение
Мохаммед Рафиек
Хорошо, если вы используете Java, но, поскольку оригинальный запросчик запрашивает HTML, возможно, это не вариант.
Пол
1

Существует по крайней мере одна ситуация, когда использование одинарных кавычек не будет работать, а именно, если вы создаете разметку «на лету» из JavaScript. Вы используете одинарные кавычки, чтобы содержать строку, и тогда любое свойство в разметке может иметь двойные кавычки для своего значения.

cvadillo
источник
1

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

(reference-to-the-tag).title = "Some \"text\"";

Он не строго разделяет функции HTML, JavaScript и CSS так, как хотят люди в наше время, но кого вам нужно сделать счастливыми? Ваши пользователи или технари, которых вы не знаете?

WebManWalking
источник
Избыточность, когда желаемый результат может быть достигнут гораздо более простым способом.
Пол
-3

Вы можете использовать этот код PHP для отображения специальных символов ...

<table border="1"><?php for($i=33;$i<9000;$i++)echo "<tr><td>&#38;#$i;<td>&#".$i.";"; ?></table>
user6000975
источник