Contenido HTML5 Editable con jQuery

Question

Tengo algunos elementos que necesitan tener el texto dentro editable, para esto estoy usando el atributo HTML 5 contentEditable. Parece que no puedo usar jQuery para esto usando múltiples selectores. Lo que quiero hacer es tener cada etiqueta dentro de un contenedor div ser editable. Esto es un ejemplo de lo que se vería como si funcionara con jQuery:

$("#container <all tags here>").contentEditable = "true"; 

No sé cómo hacer que seleccionar todas las etiquetas, pero usted consigue el punto.

Así que todo palmo, div, mesas, negrita, etc deben ser editadas individualmente

Answer 1

$('#container *').attr('contenteditable','true'); 

* significa "todos los tipos de elementos", y es análoga a a,div,span,ul,etc...

Como la mayoría de otras funciones de jQuery, attr aplica la misma operación a cada elemento capturado por el selector.

Answer 2

$("#container *").attr("contentEditable", true) 

Just a guess. Lejos de la estación de trabajo.

Answer 3

Si recuerdo correctamente, establecer el valor contentEditable en el elemento primario también haría que todos sus elementos sean editables.

Así que hacer esto:

$('#container').attr("contentEditable", "true"); 

debería funcionar.

Answer 4

tengo la impresión de que estás mala interpretación del problema en dos lugares:

1. jQuery crea objetos "consulta" que proporcionan una forma rápida para la manipulación de conjuntos de elementos DOM. Su código de ejemplo establece contentEditable en la consulta, no lo que coincide. Desea la abreviatura de jQuery para "establecer un atributo en todos los elementos coincidentes", que es $('whatever').attr('contentEditable','true');

2. No estoy seguro de que comprenda el contenido Editable correctamente. Se supone que debes configurarlo en el contenedor de nivel superior para cada región editable y sus efectos se aplican a todo lo que contiene. En mi experiencia, si configurar contentEditable en #container o algo así como #container div.post realmente no es lo suficientemente bueno, entonces tienes problemas más grandes.

Answer 5

Por alguna razón en IE10 sólo esto parecía funcionar:

$('#container').get(0).contentEditable = "true"; 

Por qué no funcionó attr no sé.