-1

私のプロジェクトでは、HTML タグ文字 (<および>) を contenteditable div に動的に追加しようとしています。ユーザーが英数字を押すたびにspan、contenteditable div でキャレットの位置を計算するために使用される空の要素を追加しています。

問題は、次のような単語を入力すると次のようになることです。

when <

b（スパン要素を追加する関数を呼び出します）のような英数字を押しwhenますwhen <b。

要素を調べたところ、contenteditable div に次のコンテンツがあることがわかりました。

when <b<span class="spanPos"></b<span>
                              ^  strange that span is holding '</b' instead of being empty

JSFiddleの例を次に示します。

これがどのように起こっているのかわかりません。この問題を回避するにはどうすればよいか教えてください。

PS: ここでは、 のような HTML 要素ではなく、 <andを追加しようとしています。><b></b>

4

3 に答える 3

1

あなたが言ったように、HTML として解釈できるシンボルを追加しようとしています。エスケープするか、別の方法を使用して ISO エンティティとして表現する必要があります。

$('#btnContent').click(function(){
    $('#content').html("when &lt;b" + "<span class='spanPos'></span>");
});

http://jsfiddle.net/Dekku/jXeVW/1/

于 2013-05-14T11:32:19.570 に答える
0

私はあなたのコードにアクセスしましたが、<bあなたがそれを使用しているかどうかわからない JS があることがわかりました。

以下のコードを使用します。

$('#btnContent').click(function(){
    $('#content').html("when" + "<span class='spanPos'></span>");
});

タグを外す<bと手に入りません。またはコードを適切にするために、適切に閉じる必要があります。

編集:

新しいコードにアクセスした後、次のコードを使用する必要がある解決策を得ました。

$('#btnContent').click(function(){
    $('#content').html("when &lt;b");
    $('#content').html($('#content').html()  + "<span class='spanPos'></span>");
});

詳細が必要な場合は、教えてください。

于 2013-05-14T11:34:22.113 に答える