Question

I have an HTML element like so:

<span id="myspan" ondblclick="edit(this)">Text to be edited</span>

How can I bind the same kind of handler -> edit(this)

to the ondblclick event through JavaScript? I want something like whats below:

function someMethod(){
   var span = document.getElementById("myspan");

   span.ondblclick = edit(span); // This line doesn't work...

}

Answer 1

It doesn’t work because you are assigning the result of that function to the dbclick handler. Try this instead;

span.ondblclick = function() {
    edit(span); 
};

Or you can do

span.ondblclick = edit;

but you need to change your edit function

function edit(event) {
    var span = event.target;
    // do your stuff
}

That way you target the clicked element.