span - ¿Cómo puedo obtener el elemento en el que está caret con Javascript, cuando uso contentEditable?
span contenteditable (1)
Digamos que tengo un código HTML como este:
<body contentEditable="true">
<h1>Some heading text here</h1>
<p>Some text here</p>
</body>
Ahora el cursor (el cursor parpadeante) está parpadeando dentro del elemento H1, digamos en la palabra "encabezado". ¿Cómo puedo obtener el nombre del elemento en el que se encuentra Caret con JavaScript? Aquí me gustaría obtener "h1".
Esto debe funcionar solo en WebKit (está incrustado en una aplicación). Preferiblemente también debería funcionar para selecciones.
En primer lugar, piensa en por qué estás haciendo esto. Si está intentando impedir que los usuarios editen ciertos elementos, simplemente configure contenteditable en falso en esos elementos.
Sin embargo, es posible hacer lo que pidas. El siguiente código funciona en Safari 4 y devolverá el nodo en el que está anclada la selección (es decir, cuando el usuario comenzó a seleccionar , seleccionando "hacia atrás" devolverá el final en lugar del inicio) - si desea que el tipo de elemento sea una cadena, acaba de obtener la propiedad nodeName del nodo devuelto. Esto también funciona para selecciones de longitud cero (es decir, solo una posición de intercalación).
function getSelectionStart() {
var node = document.getSelection().anchorNode;
return (node.nodeType == 3 ? node.parentNode : node);
}