2016-02-24 2 views
0

Я пытаюсь настроить код шаблона, и я получаю две ошибки. Первая - это непредвиденная ошибка синтаксиса маркера в файле utils.js и эталонная ошибка в файле scripts.js. Может ли кто-нибудь объяснить, почему эти ошибки возвращаются, когда все находится в правильном месте и на которые ссылаются?Почему я получаю ошибку ссылки и синтаксиса на моем сайте?

HTML

<!doctype html> 
<html> 
    <head> 
     <link rel="stylesheet" href="styles.css"> 
     <script src="utils.js"></script> 
     <script src="script.js"></script> 
    </head> 
    <body> 
     <canvas id="main" width="450" height="400"></canvas> 
    </body> 
</html> 

utils.js

var Utils = { 
    utils.captureMouse = function(element){ 
     var mouse = {x: 0, y: 0}; 

     element.addEventListener("mousemove", function(event){ 
      var x, y; 
      if(event.pageX || event.pageY){ 
       x = event.pageX; 
       y = event.pageY; 
      } 
      else{ 
       x = event.ClientX + document.body.scrollLeft + document.documentElement.scrollLeft; 
       y = event.ClientY + document.body.scrollTop + document.documentElement.scrollTop; 
      } 
      x -= element.offsetLeft; 
      y -= element.offsetTop; 
      mouse.x = x; 
      mouse.y = y; 
     }); 
     return mouse; 
    } 
}; 

script.js

window.addEventListener("load", function(){ 
    var canvas = document.getElementById("main"); 
    var ctx = canvas.getContext("2d"); 
    mouse = Utils.captureMouse(canvas); 

    canvas.addEventListener("mousedown", function(){ 
     console.log("X: " +mouse.x); 
     console.log("Y: " +mouse.y); 
    }) 
}) 

Вот ошибки

Uncaught SyntaxError: Unexpected token.    utils.js:2 
Uncaught ReferenceError: utils is not defined  script.js:4 
    (anonymous function) @ script.js:4 
+3

показать нам реальные ошибки пожалуйста :) –

+0

@StephenWright будет делать, это скриншот хорошо? –

+1

@ Robert: Нет, скриншот не в порядке. Скопируйте и вставьте здесь сообщения об ошибках и покажите нам, из каких строк они появляются (и, возможно, их трассировки стека, если они есть) – Bergi

ответ

2

Это не относится синтаксис:

var Utils = { 
    utils.captureMouse = function(){/.../} 
}; 

На этой второй линии, utils не определен. И это должно быть установка свойства, а не выполнение операции присваивания. Возможно, вы имели в виду это ?:

var Utils = { 
    captureMouse: function(){/.../} 
}; 

Вторая ошибка является просто результатом первого, так как Utils никогда не был эффективно определен. Исправление, которое должно исправить оба.

+0

Да, это сработало. Спасибо. Я следовал за книгой, и вот как их синтаксис был написан –

0

Попробуйте приложить eventListener к document.body, а не к окну и/или добавить utils.js в конце тела. Я думаю, что проблема в том, что <canvas></canvas> элемент wasn`t создан еще