2014-02-13 3 views
0

다음과 같은 문제는 발생하지 않습니다. 나는이 같은 변수를 정의 :이 같은 변수에 액세스하려고하면로드시 JavaScript 변수가 정의되지 않았습니다.

$(document).ready(function() { 
    myVar = new myClass(); 
    myVar.init(); 
}); 

:

<script type="text/javascript">var myVar;</script> 
<script type="text/javascript" src="/myScript.js"></script> 

myScript.js 다음과 같이 보입니다 모두 잘 작동

<div onclick="myVar.activate(x);">some content</div> 

하지만 내가 할 경우

<img src="path" onload="myVar.activate(x);"/> 

"myVar is not defined"오류가 발생합니다. 나는 그것을 얻지 않는다.

<script type="text/javascript">var myVar;</script> 
    some DOM Elements 
<script type="text/javascript" src="/myScript.js"></script> 
<script type="text/javascript">myVar.activate(x);</script> 

작동하지 않습니까?!? !! 이상하지 않니?

* X는 서버 측이 *

+0

onload myVar.activate (x)를 호출하는 코드의 잘못된 부분입니다.하지만이 함수는 준비중 인 DOM 내부에 있습니다. –

+0

그런데 onload는 주로 window.onload와 같이 사용됩니다. – shubendrak

+3

@Liam - 가능성이 있습니다. 그렇지 않을 수도 있습니다. 이미지로드 속도에 따라 다릅니다. – Quentin

답변

1
$(document).ready(function(){ 
    // this function is executed after the entire document is ready, 
    // and it will fire after window.onload 
    myVar = new myClass(); 
    myVar.init(); 
}); 

오류없이 동일해야합니다 myVar의 메서드에 액세스 할 수 있지만 .ready() 함수가 아직 실행되지 않았으므로 myVarnew myClass()으로 설정되지 않았습니다.아직 변수 undefined입니다

<script type="text/javascript"> 
    myVar.activate(x); 
    // this script executes *before* the code inside your document ready function, 
    // so this is *before* you have set myVar = new myClass(); 
    var_dump(myVar); 
    // above should output 'undefined' 
</script> 

당신이 정말로 이런 식으로, 당신은 당신의 인라인 스크립트에서 new myClass()myVar를 설정해야 onload 속성에서이 메소드를 호출 할/필요한 경우

:

<script type="text/javascript"> 
    var myVar = new myClass(); 
    myVar.init(); 
    myVar.activate(x); 
</script> 
+0

감사합니다. – Viktor

+0

@Viktor이 문제가 도움이 되었습니까? – Bill

+0

아직 서버 측에서 var x를 생성하는 다른 방법을 찾아야합니다.

0

여기에 무서운 아무것도 없다, 당신은 그냥 좋은 시간에 변수를 선언하지 않습니다 생성됩니다. 온라인 스크립트를 사용할 때는 브라우저가 DOM 노드를 읽기 전에 변수를 할당해야합니다.

코드에서 myVar을 DOM에 할당하므로 브라우저가 이미 DOM을 읽고 오류를 종료합니다.

내 질문에 왜 객체를 만들기 전에 DOM이 준비 될 때까지 기다려야합니까? 주변에는 확실한 해결 방법이 있습니다.

+2

변수의 * 선언 *은 문제가되지 않습니다. 'var myVar'). 문제는 * 값이 할당 된 시간입니다. – Quentin

+0

@Quentin 내 잘못, 나 missexplained, 고마워! –

0

당신의 HTML이 완전히

$(document).ready(function() { 
    myVar = new myClass(); 
    myVar.init(); 
}); 

을 렌더링 그리고 다운로드하고 브라우저로 HTML에 추가됩니다으로 다음이 즉시 렌더링 될 때 다음 기능이 실행됩니다

<img src="path" onload="myVar.activate(x);"/> 

그래서 myVar 페이지에서 <img>을 렌더링 할 때 ready()이 아직 호출되지 않았으므로 정의 할 수 없습니다. 두 번째 예제와 같은 이유. myVar 당신은 제거해야합니다

널 :

$(document).ready(function() ... 

하고 다시 시도하십시오.

+0

외부 로딩 된 스크립트에 어떤 영향을 미치기 때문에 $ (document) .ready (function()이 필요합니다. – Viktor

+0

외부로드 된 스크립트 뒤에 HTML을로드/표시해야합니다. – alexmngn

0

이유는 단순히, x이 무엇인지에 따라 그리고 분명히 선언 어디에 :

$(document).ready(function() { 
    myVar = new myClass(); 
    myVar.init(); 
    myVar.activate(x); 
}); 

링깃 결과가 당신이하려고 여기

+0

x는 서버 측 함수에 의해 생성됩니다. – Viktor

1

myVar에 값을 할당하는 코드가 문서에서 준비되어야하는 경우에는 다음과 같이 처리하는 것이 더 좋은 방법입니다.

$(document).ready(function() { 
    myVar = new myClass(); 
    myVar.init(); 

    $("#idOfMyImage").load(function() { myVar.activate(x); }); 
}); 

DOM 준비 이벤트가 발생하고 myVar 값이 할당 된 후에 만 ​​load 처리기를 연결하려고합니다. 문서 준비가 시작될 때까지 이미 이미지가로드 된 경우 이미지가로드 될 때 즉시 실행되고 그렇지 않은 경우 즉시 실행됩니다. 이제는 두 이벤트가 발생하는 순서에 따라 코드를 작성한 경쟁 조건을 제거했습니다. 이미지를 제공하는 서버가 데이터를 제공 할만큼 느린 경우 원래 코드가 작동했을 수 있습니다. 로드 중은 브라우저에서 캐시합니다.)

보너스로 이제 자바에서 HTML을 더 잘 구분할 수있는 인라인 이벤트 처리기를 제거했습니다.

0

빌리 매튜스 덕분에 왜 작동하지 않는지 알 수 있습니다. 고마워요!

이 내가 그것을 어떻게 지금 (청소,하지만 작동하지 않습니다!)입니다

<script type="text/javascript" src="/myScript.js"></script> 

myScript.js는 다음과 같은 :

$(document).ready(function() { 
var ServerGeneratedValue = $('myID').html(); 

var myVar = new myClass(); 
myVar.init(); 

myVar.activate($ServerGeneratedValue); 
}); 

모든 답변을 주셔서 대단히 감사합니다!

관련 문제