将带有事件侦听器的元素传递给模板事件中的appendChild

时间:2016-08-12 06:37:22

标签: javascript meteor

此Meteor客户端代码无法在公共方法中创建的画布上触发mousemove事件。 onmousemove也失败了 可以这样做,如果是这样,怎么办?

Template.report.events({
    'click #myElemnt': functionj(event) {
        event.target.appendChild(lib.myCanvas());
    }
})

//lib.js
lib = (function() {

    return {
        myCanvas: () => {

            let canv = document.createElement('canvas');
            //style it here
            canv.addEventListener('onmousemove', function() {
                console.log('moving');
            }
            return canv;
        }

    })();

修改
以下是更改语法

后代码的一部分
lib = (function() {

      return {

        myCanvas: () => {
          let sigCanvas = document.createElement('canvas');
          sigCanvas.style.position = 'absolute';
          sigCanvas.style.width = 25 + 'em';
          sigCanvas.style.height = 15 + 'em';
          sigCanvas.style.top = -90 + 'px';
          sigCanvas.style.left = -50 + 'px';
          sigCanvas.id = 'signature';
          sigCanvas.style.border = '1px solid black';

          sigCanvas.addEventListener('onmousemove', function() {
            console.log('mouse moving again');
          }, false);
          return sigCanvas;
        }
      }());

EDIT2
这是浏览器元素选项卡中的画布 enter image description here

1 个答案:

答案 0 :(得分:0)

根据EventTarget API,您应该为on方法提供没有addEventListener前缀的事件类型。

这应该做的工作:

sigCanvas.addEventListener('mousemove', function(e) {
  console.log('mouse moving again');
});