todas - ¿Cómo escapar correctamente de las citas dentro de los atributos html?

que es un valor en html

Question

Tengo un menú desplegable en una página web que se está rompiendo cuando la cadena de valor contiene una cotización.

El valor es "asd pero en el DOM siempre aparece como una cadena vacía.

He intentado de todas las maneras que conozco para escapar de la cuerda correctamente pero sin éxito.

<option value=""asd">test</option>
<option value="/"asd">test</option>
<option value="&quot;asd">test</option>
<option value="&#34;asd">test</option>

¿Alguna idea de cómo representar esto en la página para que el mensaje de devolución contenga el valor correcto?

Answer 1

No hay forma de escapar de las comillas en el valor de un texto de entrada ... pero puede usar javascript (o jquery):

<input type="input" name="myinput" id="myinput" value="" />
<script>document.getElementById("myinput").value="This input has a [/"]";</script>

Answer 2

Otra opción es reemplazar las comillas dobles por comillas simples si no te importa lo que sea. Pero no menciono este:

<option value=''"asd''>test</option>

Menciono este:

<option value="''asd">test</option>

En mi caso utilicé esta solución.

Answer 3

Por sintaxis HTML , e incluso HTML5 , las siguientes son todas las opciones válidas:

<option value="&quot;asd">test</option>
<option value="&#34;asd">test</option>
<option value=''"asd''>test</option>
<option value=''&quot;asd''>test</option>
<option value=''&#34;asd''>test</option>
<option value=&quot;asd>test</option>
<option value=&#34;asd>test</option>

Tenga en cuenta que si está utilizando la sintaxis XML, se requieren las comillas (simple o doble).

Aquí hay un jsfiddle que muestra todo lo anterior funcionando .

Answer 4

Realmente solo debes permitir datos no confiables en una lista blanca de buenos atributos como: alinear, alink, alt, bgcolor, border, cellpadding, espaciado de celdas, clase, color, colspan, coords, coords, dir, face, height, hspace, ismap, lang , marginheight, marginwidth, multiple, nohref, noresize, noshade, nowrap, ref, rel, rev, rows, rowspan, scrolling, forma, span, resumen, tabindex, título, usemap, valign, value, vlink, vspace, ancho

Realmente desea mantener los datos no confiables fuera de los controladores de javascript, así como los atributos de identificación o nombre (pueden eliminar otros elementos en el DOM).

Además, si está colocando datos no confiables en un atributo SRC o HREF, entonces realmente es una URL no confiable, por lo que debe validar la URL, asegúrese de que NO sea una javascript: URL, y luego la codificación de entidad HTML.

Más detalles sobre todo lo que hay aquí: https://www.owasp.org/index.php/Abridged_XSS_Prevention_Cheat_Sheet

Answer 5

Si está utilizando PHP, intente llamar a la función htmlentities o htmlspecialchars .

Answer 6

" Es la forma correcta, la tercera de tus pruebas:

<option value="&quot;asd">test</option>

Puedes ver esto trabajando a continuación, o en jsFiddle .

alert($("option")[0].value);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select>
  <option value="&quot;asd">Test</option>
</select>

Alternativamente, puede delimitar el valor del atributo con comillas simples:

<option value=''"asd''>test</option>