So vermeiden Sie doppelte Anführungszeichen in einem Titelattribut


195

Ich versuche, eine Zeichenfolge zu verwenden, die doppelte Anführungszeichen im title-Attribut eines Ankers enthält. Bisher habe ich Folgendes versucht:

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

und

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

Bitte beachten Sie, dass die Verwendung von einfachen Anführungszeichen keine Option ist.


18
@Haim las die Frage… es heißt "einfache Anführungszeichen sind keine Option".
Nils Riedemann

2
@harpax - Ich war nur neugierig, warum einfache Anführungszeichen keine Option sind.
Bert F

3
Einfache Anführungszeichen sind in HTML nicht gültig.
Skyfoot

1
Ihr zweites Beispiel sollte absolut perfekt funktionieren. In welchem ​​Browser sehen Sie das Problem?
Olly Hodgson

1
@harpax: Vielleicht sollten Sie die Anforderung "Einfache Anführungszeichen sind keine Option" klarstellen. Ich hätte vermutet, dass Sie einfache Anführungszeichen "innerhalb der Zeichenfolge" nicht als Option angeben (wie sie dem Benutzer angezeigt werden), aber nur einfache und doppelte Anführungszeichen umzudrehen, wie Haim oben gezeigt hat, wäre in Ordnung.
Christian.K

Antworten:


284

Diese Variante -

<a title="Some &quot;text&quot;">Hover me</a>

Ist korrekt und funktioniert wie erwartet - auf der gerenderten Seite werden normale Anführungszeichen angezeigt.


Ja. <a href="#" title="Foo &quot;Bar&quot;">Testing</a>und <a href="#" title="Smart quotes &#8221;Bar&#8220;">Testing too</a>arbeite für mich.
Olly Hodgson

5
@Maris: Nun ... ich sehe keine normalen Anführungszeichen auf der gerenderten Seite, wenn ich & quot; (Firefox, Chrome). Warum?
Krzysztof Trzos

@Maris, gleiches Problem hier. Siehe den Text "& quot;" wird sowohl im IE als auch in Chrome angezeigt, wenn der Benutzer mit der Maus über das Element fährt.
Stapelhaus

Erstaunlicherweise mit HTML-Inhalten gearbeitet, die in Attribut eingebettet sind (damit Javascript einen bearbeitbaren Textbereich erzeugt):data-editable-note="<?php echo str_replace('"', '&quot;', $note); ?>"><?php echo mark::up($note); ?></div>
WEBjuju

23

Hier ist ein Ausschnitt der HTML-Escape-Zeichen, die von einer zwischengespeicherten Seite auf archive.org stammen :

&#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

Der Escape-Code &#34;kann auch anstelle von verwendet werden &quot;.


3

Verwenden &quot;ist der Weg, um es zu tun. Ich habe Ihr zweites Code-Snippet ausprobiert und es funktioniert sowohl in Firefox als auch in Internet Explorer.


2

Es kann mit jedem Zeichen aus der HTML Escape- Zeichenliste funktionieren , aber ich hatte das gleiche Problem mit einem Java-Projekt. Ich habe verwendet StringEscapeUtils.escapeHTML("Testing \" <br> <p>")und der Titel war<a href=".." title="Test&quot; &lt;br&gt; &lt;p&gt;">Testing</a> .

Es hat nur bei mir funktioniert, als ich die StringEscapeUtils in geändert habe StringEscapeUtils.escapeJavascript("Testing \" <br> <p>")und es hat in jedem Browser funktioniert.


beste Lösung meiner Meinung nach
Mohammed Rafeeq

Gut, wenn Sie Java verwenden, aber da der ursprüngliche Anfrager nach HTML fragt, ist dies möglicherweise keine Option.
Paul

1

Es gibt mindestens eine Situation, in der die Verwendung von einfachen Anführungszeichen nicht funktioniert, wenn Sie das Markup "on the fly" aus JavaScript erstellen. Sie verwenden einfache Anführungszeichen, um die Zeichenfolge zu enthalten, und dann kann jede Eigenschaft im Markup doppelte Anführungszeichen für ihren Wert haben.


1

Vielleicht können Sie JavaScript verwenden, um Ihr browserübergreifendes Problem zu lösen. Es verwendet einen anderen Fluchtmechanismus, mit dem Sie offensichtlich bereits vertraut sind:

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

Es trennt die Funktionen von HTML, JavaScript und CSS nicht so, wie es die Leute heutzutage wollen, aber wen müssen Sie glücklich machen? Ihre Benutzer oder Techniker, die Sie nicht kennen?


Overkill, wenn das gewünschte Ergebnis weitaus einfacher erzielt werden kann.
Paul

-3

Mit diesem PHP-Code können Sie Sonderzeichen auflisten ...

<table border="1"><?php for($i=33;$i<9000;$i++)echo "<tr><td>&#38;#$i;<td>&#".$i.";"; ?></table>
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.