1

I have a div that is initially has contenteditable=false. 

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

I want to make it contenteditable=true and focus it after double click. 

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

$(function() {

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

});

If i call make_focus() directly, without dblclick event like this

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

then i get #my_div focused the way i need. However, when i check how it works with dblclick then i get a different result. The first thing is that after double click the text gets selected and i don't need it. The second thing is that in IE the div doesn't get focused after double click. Again, i want that double click to work like the function that is called directly. Here is the link to jsfiddle that shows how it should work http://jsfiddle.net/cH3Xs/14/ . And another link that shows how it should not work(please, check in IE) http://jsfiddle.net/Vr8yB/5/

P.S. following solution seems to work:Text selection in div(contenteditable) when double click

Community
  • 1
  • 1
user2265529
  • 479
  • 1
  • 8
  • 18

1 Answers1

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