contenteditable = "true"で複数行のテキストを削除すると、<br>タグが追加されます

Question

divタグに関連するcontenteditable属性に関する多くの質問がありましたが、私の問題は少し異なります。

私はEnterキーを押すと、新しい行を追加することが<div>または<br>を追加するかどうかを気にしないが、私はCTRL + Aを押すと、その後DELまたはBACKSPACEを押すことによって、それをクリアすることで、すべてのテキストを選択するとき、それは追加の<br>を追加します。しかし、テキストが1行にしかない場合、それを選択して消去すると何も残らない。

多くの行のテキストをクリアすると、追加の<br>タグが追加される状況を避けるにはどうすればよいですか？

Answer 1

ContentEditableは、ブラウザーによって管理され、フォーマットタグを適切に注入します。したがって、プレーンテキストが必要な場合は、テキストエリアの入力をお勧めします。それが実行可能なオプションではない場合、または他のすべての書式設定が必要な場合は、javascriptまたはjQueryリスナーを使用して各キーストロークでinnerHTMLをチェックし、不正なbrタグが含まれていないかどうかを確認できます。

$("div").on("keyup", function() { 
    if (this.innerHTML === "<br>") { 
    this.innerHTML = ""; 
    } 
});