研究fabricjs中发现,它提供canvas.on('mousemove', hh) 来绑定事件, 提供 canvas.off()来取消绑定事件这样的接口,很是方便,
那我们就不妨探究一下内在的实现原理:
<h1> The "Post-Link" Function Is The "Link" Function In AngularJS Directives </h1> <p bn-using-post-link bn-using-link bn-using-fn-only> Look at the console-output; I am logging the link-functions from within the AngularJS source-code. <button onclick="cancelEve();">取消事件</button> </p> <script> function say(){ console.log('say arguments: ', arguments); console.log(arguments.length); for(var i in arguments){ console.log(arguments[i]); } } say(1, 2, 3); // document.onmousemove = function (ev) { // console.log('moving', ev); // for(var i in ev){ // console.log("i: ", i, '-------------:',ev[i]); // } // }; function mousemoveHandler() { console.log('mousemove'); } function mousemoveHandler2() { console.log('mousemove 2'); } document.addEventListener('mousemove', mousemoveHandler); document.addEventListener('mousemove', mousemoveHandler2); var cancelEve = (function (){ // document.onmousemove = null; var i = 0; return function(){ i++; document.removeEventListener('mousemove', mousemoveHandler); if(i == 2){ document.removeEventListener('mousemove', mousemoveHandler2); } }; })(); <script>
--------------------------------------------------------------------
通过 addEventListener() 可以对同一个事件绑定多个处理处理函数, 而通过 document.onmousemove = function(){//....}这样好像只能绑定一个处理函数。
取消事件绑定的话,后者只需要 document.onmousemove = null 就可以了。
而前者,则需要通过 removeEventListener() 这个函数来取消绑定的事件, 需要一个一个取消绑定。
-----------------------------------------------------------
直接通过document.onmousemove = hh 绑定的事件,后面绑定的事件会覆盖掉前面绑定的事件。
function mousemoveHandler() { console.log('mousemove'); } function mousemoveHandler2() { console.log('mousemove 2'); } document.onmousemove = mousemoveHandler; document.onmousemove = mousemoveHandler2; var cancelEve = function (ev) { document.onmousemove = null; }