javascript - 双击 contenteditable div 后将其聚焦

Question

我有一个 div，最初的 contenteditable=false。

<div contenteditable="false" tabindex='1' style="width:100px;height:100px" id="my_div" >def text</div>

我想让它 contenteditable=true and双击后聚焦。

function make_focus()
{
$("#my_div").prop('contenteditable','true'); 
$("#my_div").focus();   
}

$(function() {

    $("#my_div").dblclick(function(e)
    {
    make_focus();
    })

});

如果我调用 make_focus() directly ，没有像这样的 dblclick 事件

<input type=button value='make focus' onclick="make_focus()">

然后我聚焦#my_div the way i need 。然而，when i check how it works with dblclick然后我得到不同的结果。第一件事是双击后，文本被选中，i don't need it 。第二件事是in IE the div doesn't get focused after double click 。再次，我希望双击像直接调用的函数一样工作。这是 jsfiddle 的链接，显示它应该如何工作 http://jsfiddle.net/cH3Xs/14/ 。另一个链接显示它不应该工作(请在 IE 中检查)http://jsfiddle.net/Vr8yB/5/

附注。以下解决方案似乎有效:Text selection in div(contenteditable) when double click

Answer 1

<div style="width:800px;height:100px" ondblclick="this.contentEditable=true;" onblur="this.contentEditable=false;this.className='';" contenteditable="false">Double click to see</div>