Wie kann ich das Element erhalten die Einfügemarke mit Javascript ist, wenn contentEditable mit?

StackOverflow https://stackoverflow.com/questions/1197401

Frage

Lassen Sie uns sagen, ich habe einige HTML-Code wie folgt: 

<body contentEditable="true">
   <h1>Some heading text here</h1>
   <p>Some text here</p>
</body>

Nun ist die Caretzeichen (der blinkende Cursor) innerhalb des H1-Element blinkt, sagen wir mal, in dem Wort „Überschrift“. Wie kann ich den Namen des Elements erhalten das Caret mit JavaScript ist? Hier würde Ich mag „h1“ erhalten.

Diese Anforderungen an die Arbeit nur in WebKit (in einer Anwendung eingebettet ist). Es sollte vorzugsweise auch für Auswahlen arbeiten.

War es hilfreich?

Lösung

Erstens, denken Sie Warum Sie tun dies. Wenn Sie zu stoppen Benutzer sind versuchen, bestimmte Elemente aus der Bearbeitung nur Satz contenteditable auf falsch auf den Elementen.

Allerdings ist es möglich, zu tun, was Sie fragen. Der folgende Code funktioniert in Safari 4 und kehrt den Knoten die Auswahl verankert ist (dh wenn der Benutzer gestartet, um , die Auswahl von „rückwärts“ wird das Ende statt dem Start zurück) - wenn Sie möchten, der Elementtyp als String, nur um die nodeName Eigenschaft des zurückgegebenen Knoten. Dies funktioniert für Null-Länge Auswahlen als auch (das heißt nur eine Caretposition). 

function getSelectionStart() {
   var node = document.getSelection().anchorNode;
   return (node.nodeType == 3 ? node.parentNode : node);
}
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top