jQuery on "enter key" create content editabledom 元素并选择它

Question

$(document).ready(function(){
    $( "p[contenteditable]" ).on( "keypress", function(e) {
        var code = e.keyCode;
        if(code == 13) { //Enter key
            $(this).after('<p class="new" [contenteditable]>hi</p>');
            $('p.new').css("color","red").focus();
            e.preventDefault();
        }
    });
});

查看此提琴:http://jsfiddle.net/tehtrav/T2U9M/

我试图创建一个新的<p contenteditable></p>时，按下回车键，并改变焦点到它，但焦点似乎没有触发。如果我将焦点设置为新段落以外的元素，它就会工作(参见这个提琴)，但如果我在新创建的段落上调用焦点，则不会。

任何想法?

Answer 1

当我使用你的代码，但把括号我们的新段落的创建，它工作

$(document).ready(function(){
    $( "p[contenteditable]" ).on( "keypress", function(e) {
        var code = e.keyCode;
        if(code == 13) { //Enter key
            $(this).after('<p class="new" contenteditable>hi</p>');
            $('p.new').css("color","red").focus();
            e.preventDefault();
        }
    });
});