I want to delegate an event from one element to another. I have this simple test code, and I get an exception:
Error: UNSPECIFIED_EVENT_TYPE_ERR: DOM Events Exception 0 ` at line 12 (the dispatch)
I have read this, but the commented line before it, makes no difference. How can I make this work?
Code:
<!DOCTYPE html>
<html>
<head>
<script src="jquery.js"></script>
<script>
function init(){}
function delegator(e){
alert('the first');
var other = document.getElementById('myCanvas2');
//e.trigger = other;
other.dispatchEvent(e);
}
$("#myCanvas").live('dblclick', delegator);
$("#myCanvas2").live('dblclick', function(){alert('the second');});
</script>
</head>
<body>
<canvas id="myCanvas" style="width:1200px; height:600px; border: solid black 1px;"></canvas>
<canvas id="myCanvas2" style="width:1200px; height:600px; border: solid black 1px;"></canvas>
</body>
</html>
- It is important to me that all the information is going to the delegated object, since it will be replaced with various other objects like a Google Maps canvas or any other service.
.livewas deprecated a while ago.Since you are using jQuery use
.trigger(...)Demo: http://jsfiddle.net/maniator/zbJBd/