2013-05-02 3 views
0

현재 노드 상태의 노드 응용 프로그램을 매우 간단하게 만들고 있지만 알아낼 수없는 문제가 발생합니다.node.js에 포함 된 JS 파일의 이상한 동작

내 명시 응용 프로그램의 생성 된 HTML은 다음과 같습니다 : 그래서

function Mouse(onObject){ 
var mouseDown = [0, 0, 0, 0, 0, 0, 0, 0, 0], 
mouseDownCount = 0; 
var mouseDownCallbacks = [0, 0, 0, 0, 0, 0, 0, 0, 0]; 
var mouseTracer = 0; 
var tracePosArray; 
var target = onObject; 

if(!onObject){ 
    onObject = document; 
} 

onObject.onmousedown = function(evt) { 
    mouseDown[evt.button] = 1; 
    mouseDownCount--; 
    if(mouseDownCallbacks[evt.button] != 0){ 
     mouseDownCallbacks[evt.button](evt); 
    } 
} 
onObject.onmouseup = function(evt) { 
    mouseDown[evt.button] = 0; 
    mouseDownCount--; 
} 

var mousemoveCallback; 
onObject.onmousemove = function(evt){ 
    //Tracing mouse here: 
    if(mouseTracer){ 
     tracePosArray.push([evt.pageX,evt.pageY]); 
    } 

    if(mousemoveCallback){ 
     mousemoveCallback(evt); 
    } 
} 

var mouseWheelCallback; 
onObject.onmousewheel = function(evt){ 
    if(mouseWheelCallback){ 
     mouseWheelCallback(evt); 
    } 
} 

var mouseOverCallback; 
onObject.onmouseover = function(evt){ 
    if(mouseOverCallback){ 
     mouseOverCallback(evt); 
    } 
} 

var mouseOutCallback; 
onObject.onmouseout = function(evt){ 
    if(mouseOutCallback){ 
     mouseOutCallback(evt); 
    } 
} 


//TODO: There is a bug when you move the mouse out while you are pressing a button. The key is still counted as "pressed" even though you release it outside of the intended area 
//NOTE: might have fixed the bug. Do some further investigation by making a smaller element. 
this.anyDown = function(){ 
    if(mouseDownCount){ 
     for(p in mouseDown){ 
      if(mouseDown[p]){ 
       return true; 
      } 
     } 
    } 
} 

this.setLeftDownCallbackFunction = function(fun){ 
    mouseDownCallbacks[0] = fun;     
} 
this.setRightDownCallbackFunction = function(fun){ 
    mouseDownCallbacks[2] = fun;     
} 
this.setMiddleDownCallbackFunction = function(fun){ 
    mouseDownCallbacks[4] = fun;     
} 

this.setSpcifiedDownCallbackFunction = function(num, fun){ 
    mouseDownCallbacks[num] = fun;    
} 

this.leftDown = function(){ 
    if(mouseDownCount){ 
     return mouseDown[0] != 0; 
    } 
} 
this.rightDown = function(){ 
    if(mouseDownCount){ 
     return mouseDown[2] != 0; 
    } 
} 
this.middleDown = function(){ 
    if(mouseDownCount){ 
     return mouseDown[4] != 0; 
    } 
} 

this.setMouseMoveCallback = function (callback){ 
    mousemoveCallback = callback; 
} 
this.setMouseWheelCallback = function (callback){ 
    mouseWheelCallback = callback; 
} 
this.setMouseOverCallback = function (callback){ 
    mouseOverCallback = callback; 
} 
this.setMouseOutCallback = function (callback){ 
    mouseOutCallback = callback; 
} 

this.enableTracer = function(){ 
    tracePosArray = new Array(); 
    mouseTracer = 1; 
} 

this.getMouseTracerData = function() { 
    return tracePosArray; 
} 

} 

:

<html style="" class=" js no-touch svg inlinesvg svgclippaths no-ie8compat"> 
<head> 
... 
<script type="text/javascript" src="/javascripts/mouse.js"></script> 
... 
</head> 
<body class="antialiased" style=""><div class="row"><div class="row"> 
<script> 
var mouse; 
var X = 0; 
var Y = 0; 
window.onload = function() 
{ 
alert(Mouse());//=> undefined 
mouse = Mouse(); 

mouse.setMouseMoveCallback(function(e){ //THIS LINE FAILS: "Cannot call method 'setMouseMoveCallback' of undefined" 
    X = e.x; 
    Y = e.y; 
    alert("move"); 
}); 
} 
... 
</html> 

(가) 포함 헤더에 스크립트 태그는 자바 스크립트 파일을 추가 나는 확신 한 그 JS 파일 로드되었습니다. 하지만 아무도 덜 Mouse() 메서드 내 window.onload 본문에 액세스 할 수 없습니다, 그것은 undefined로 나타납니다. 이것은 매우 이상합니다. 왜냐하면 과 똑같은 일을하는 HTML 파일을 만들면에 액세스 할 수 있기 때문입니다.

여기에 무슨 일이 일어나고 있습니까? node.js/express에 이런 종류의 상호 작용을 불가능하게하는 마술 트릭이 있습니까?


추가 참고 : 나는 템플릿 엔진으로 옥을 사용하고

  • .
  • "mouse.js"파일이 작동합니다. 전에 여러 번 사용했습니다.
  • 클라이언트와 서버 간의 통신에 socket.io를 사용하고 있습니다.

전체 헤더 :

<head><title>My awesome title</title><link rel="stylesheet" href="/stylesheets/foundation.min.css"><link rel="stylesheet" href="/stylesheets/normalize.css"><link rel="stylesheet" href="/stylesheets/style.css"><script type="text/javascript" src="/socket.io/socket.io.js"></script><style type="text/css"></style><script type="text/javascript" src="/javascripts/jquery.min.js"></script><script type="text/javascript" src="/javascripts/vendor/custom.modernizr.js"></script><script type="text/javascript" src="/javascripts/vendor/zepto.js"></script><script type="text/javascript" src="/javascripts/mouse.js"></script><meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"><meta name="viewport" content="width=device-width"></head> 
+0

마우스를 방해하거나 다시 정의 할 수있는 다른 코드가 있습니까? 옥/익스프레스 문제가 아닌 것처럼 보입니다 – furydevoid

답변

1

마우스 기능이 정의되지 않은 경우 오류가 발생합니다. 알리미가 '정의되지 않음'을 표시하는 이유는 Mouse 함수가 아무 것도 반환하지 않으므로 정의되지 않았기 때문입니다. 'new Mouse()'와 마찬가지로 생성자로 사용해야합니다.

+0

그건 문제였습니다. 아무 래도 나는 그것이'new Mouse()'여야한다는 것을 알 수 없었다. 감사! – Automatico

관련 문제