javascript - キャレット/カーソル位置を contenteditable div の最後に設定する

Question

contenteditable div の場合、FireFox 固有の問題を修正するため。div の最後に br タグを追加する必要がありました。

 <div id="testDiv" contentEditable="true">
Hey, click the button then hit space.<br>    
</div>

これは実際に、google plus が contentEditable div ロジックをユーザーのタグ付けで処理する方法です。

問題は、カーソルをFirefoxのdivの最後に移動すると、キャレットが
タグの後にあり、スペースを押すと次の行に移動することです。

ここでその動作をテストできます: jsFiddleボタンをクリックしてスペース キーを押します。

次のコードを使用して、キャレットを範囲の最後の位置に移動しています。

function placeCaretAtEnd(el) {
            el.focus();
            if (window.getSelection){
                if (typeof window.getSelection != "undefined"
                        && typeof document.createRange != "undefined") {
                    var range = document.createRange();
                    range.selectNodeContents(el);
                    range.collapse(false);
                    var sel = window.getSelection();
                    sel.removeAllRanges();
                    sel.addRange(range);
                } else if (typeof document.body.createTextRange != "undefined") {
                    var textRange = document.body.createTextRange();
                    textRange.moveToElementText(el);
                    textRange.collapse(false);
                    textRange.select();
                }
            }
        }

このコードを変更して br タグを無視するか、代わりにカーソル位置を br タグの直前に移動することはできますか?