javascript - Firefox 没有正确选择 contenteditable 文本

Question

我正在尝试在网络应用程序中实现元素的内联编辑。我正在使用 contenteditable 执行此操作，以便在用户编辑元素时保留格式。

用户双击某个元素后，我将其 contenteditable 属性设置为 true 并选择文本(使用此 SO question 中的方法)以便他们可以立即开始编辑，而无需选择文本。这在 Chrome 和 Safari 中按预期工作(不关心 IE)。 但是，在 Firefox 中，文本确实会被选中，但在您取消选择并手动重新选择文本之前，它是不可编辑的。(例如，如果您双击一个元素，它会被选中，但如果您开始输入编辑选定的文本，什么也不会发生)

我试过 stopPropagation()、preventDefault() 和 execCommand('selectAll', false, null) 都没有用。

这是一个 JSFiddle告诉你我在说什么。在 Chrome/Safari 和 Firefox 中尝试，看看 Firefox 中的问题是什么。

$('#title').dblclick(function(){
    $('#title').attr({'contenteditable' : true});
    $('#title').css({'border-bottom' : '3px dashed #E3E1E4'});            
    selectText('title'); 
});

Answer 1

将以下行添加到 dblclick 处理程序:

$('#title').focus();