36

次のようなHTMLコードがあるとしましょう。

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

これで、カレット（点滅するカーソル）が<h1>要素内で点滅します。たとえば、単語で言い"|heading"ます。

JavaScriptでカレットが含まれる要素を取得するにはどうすればよいですか？ここでノード名を取得したいと思います："h1"。

これはWebKitでのみ機能する必要があります（アプリケーションに埋め込まれています）。選択のためにも機能することが望ましい。

4

1 に答える 1

59

まず、なぜこれをしているのかを考えてください。ユーザーが特定の要素を編集できないようにする場合はcontenteditable、それらの要素をfalseに設定するだけです。

しかし、あなたが求めることをすることは可能です。以下のコードはSafari4で機能し、選択が固定されているノードを返します（つまり、ユーザーが選択を開始した場所で、 「後方」を選択すると、開始ではなく終了が返されます）–要素タイプを文字列として使用する場合は、nodeName返されたノードのプロパティを取得するだけです。これは、長さがゼロの選択（つまり、単なるカレット位置）でも機能します。

function getSelectionStart() {
   var node = document.getSelection().anchorNode;
   return (node.nodeType == 3 ? node.parentNode : node);
}
于 2009-07-31T11:13:35.803 に答える