Comment échapper à un guillemet simple?

188

Comment puis-je échapper à un '(guillemet simple) en JavaScript?

C'est là que j'essaye de l'utiliser:

<input type='text' id='abc' value='hel'lo'>

Le résultat pour le code ci-dessus est "hel" rempli dans la zone de texte. J'ai essayé de remplacer «par», mais c'est ce que j'obtiens.

<input type='text' id='abc' value='hel\'lo'>

Le résultat pour le code ci-dessus est "hel \" rempli dans la zone de texte.

Comment puis-je réussir à échapper aux guillemets simples?

html escaping Ravi
la source
Hé Ravi, c'est plus une question html. J'ai repensé la question au format HTML, mais vous voudrez peut-être changer cela dans votre question.
Benjamin Manns

Réponses:

358

Vous pouvez utiliser des entités HTML:

  • &#39; pour '
  • &#34; pour "
  • ...

Pour en savoir plus, vous pouvez consulter les références d'entités de caractères en HTML .

Pascal MARTIN
la source
39
Pourquoi devrait - on utiliser des guillemets pour les valeurs d'attributs?
Gumbo
5
@Pascal MARTIN: XML autorise également les guillemets simples pour les valeurs d'attribut. (Voir w3.org/TR/xml/#NT-AttValue )
Gumbo
4
@Gumbo: wooo! Je ne pense pas avoir jamais vu de document XML utilisant des valeurs d'attributs entre guillemets simples; donc je ne pensais pas que c'était réellement valable ;; J'ai juste (encore) appris quelque chose en répondant à une question; alors merci pour ces commentaires!
Pascal MARTIN
5
Je sais que c'est vieux, mais je pense qu'il vaut la peine de noter qu'il existe une entité HTML pour ":&quot;
daiscog
1
@Pascal, le validateur w3c montre que les guillemets simples sont valides pour les attributs. Et voir stackoverflow.com/questions/2210430/…
ChrisJJ
62

Vous pouvez utiliser &apos;(qui est incertain dans IE) ou &#39;(qui devrait fonctionner partout). Pour une liste complète, consultez les références de caractères nommés HTML5 du W3C ou le tableau des entités HTML sur WebPlatform.org .

Benjamin Manns
la source
Wow, ça fait un moment que j'ai écrit ça. Merci d'avoir pris connaissance - j'ai mis à jour les liens vers deux tableaux sur W3C et WebPlatform.org.
Benjamin Manns
Celles-ci fonctionnent "partout" sauf dans les attributs d'expression VXML <var> où un échappement supplémentaire est nécessaire car dans VXML <var> une valeur de variable String est indiquée sous forme de guillemets simples dans les doubles guillemets normaux des définitions d'attribut: <var name = "myvar" expr = "'hel \ & apos; lo'" />
Steve Cohen
9

Comme vous êtes dans le contexte du HTML, vous devez utiliser HTML pour représenter ce caractère. Et pour HTML, vous devez utiliser une référence de caractère numérique &#39; ( &#x27;hexadécimal):

<input type='text' id='abc' value='hel&#39;lo'>
Gombo
la source
mais je n'ai pas compris ce que vous entendez par context of html?
coding_idiot
@coding_idiot Jetez un œil aux différents jetons qu'un analyseur HTML peut rencontrer pendant le processus d'analyse . Chaque état a un ensemble différent de règles d'analyse qui sont déclenchées en fonction de l'entrée. Tous les états n'autorisent pas les références de caractères. Maintenant, si vous regardez la valeur de l' attribut (entre guillemets simples) , vous pouvez voir que a &indique le début d'une référence de caractère.
Gumbo
7

Représentez-le comme une entité de texte (ASCII 39):

<input type='text' id='abc' value='hel&#39;lo'>
AndiDog
la source
6

Probablement le moyen le plus simple:

<input type='text' id='abc' value="hel'lo">
route242
la source
-1

Vous pouvez essayer d'utiliser: &#145;

la perte
la source
-1

utiliser les fonctions javascript inbuild escape et unescape

par exemple

var escapedData = escape("hel'lo");   
output = "%27hel%27lo%27" which can be used in the attribute.

again to read the value from the attr

var unescapedData = unescape("%27hel%27lo%27")
output = "'hel'lo'"

Cela sera utile si vous avez d'énormes données json stringify à utiliser dans l'attribut

Ram Bharlia
la source
escapen'est pas sûr unicode. La spécification déconseille son utilisation.
Quentin