5

プロパティを使用して編集可能な div を使用する必要がある、私のプロジェクト用の単純なエディターを作成していcontenteditableます。2 つの機能が必要です。

  • 2人が入った後に自動挿入時間
  • 入力の代わりに段落を作成し、<br>それに集中します。

だから私はこれを書きました(いくつかのインスピレーションを得て)、これは責任のあるコードの一部です:

var intercept = {
    keydown: function(e)
    {
        if( e.which == 13 ){
            intercept.enterKey.call(null, e);
        }
    },

    enterKey: function(e)
    {
        var $lastElm;

        // Find the previous elm
        if (document.selection) { // IE
            $lastElm = $(document.selection.createRange().parentElement());
        } else { // everyone else
            $lastElm = $(window.getSelection().anchorNode);
        }

        // Handle enter key
        if( !e.shiftKey )
        {
            // Check if two or more paragraphs
            // are empty, so we can add an hr
            if(
                $.trim($lastElm.text()) === "" &&
                !$lastElm.prev().is('hr')
            ){
                document.execCommand('insertParagraph', false);
                $lastElm.replaceWith($('<hr>', {contenteditable: false}));
            }
            // Or just add an paragraph
            else{
                document.execCommand('insertParagraph', false, true);
            }

            e.preventDefault();
        }
    }
}

これは Chrome では問題なく動作しますが、Firefox では新しい要素を作成しません<p>。現在のテキストを でラップするだけだと思います。そのため、カーソルはFirefoxに留まり、新しい段落は作成されません。pp

これを修正する方法はありますか?
ありがとう。

4

2 に答える 2