0

テキストエディタを開発しています。私は content editable を持っています。その中には、実際のスタイル プロパティを持つ要素<div>が配置されます。<span>これで、これらのスパン要素内にキャレットを配置する方法がわかりましたが、入力を開始すると、テキストはスパンの外側、つまり div 自体の内側に出力されます。

キャレットの配置に関連するコードは次のとおりです。

var rs = $( "#textEntry" ).insert( "span" ).set( "style" , style );

            sel = window.getSelection();

            sel.collapse( rs[ 0 ] , 0 );

            rs[ 0 ].focus();

rs[ 0 ]現在のスパン要素はどこにありますか。

どうすればこの動作を乗り越えることができますか?

PS$は jQuery ではありません。

4

1 に答える 1

0

これで遊んだ後、解決策は次のようになります。

内部テキストを追加し、要素の最初の子 (TEXT ノード) にキャレットを設定して、テキストを削除する必要がありました。キャレットはその位置にとどまり、ほら！できます。

var rs = $( "#textEntry" ).insert( "span" ).set( "style" , style ).html( "a" );

rs[ 0 ].focus();
if ( document.selection ) {
    sel = document.selection.createRange();
    sel.moveStart( 'character' , 0 );
    sel.select();
}
else{
    sel = window.getSelection();
    sel.collapse( rs[ 0 ].firstChild , 0 );
}

rs.html( "" , true );

みんな、他の解決策を見てうれしいです！

于 2012-10-04T19:09:00.697 に答える