2014-01-22 2 views
-1

작동하지 않습니다 내가 내가 다음처럼 HTML이

의 기본 기능에 손을 시도, JQuery와의 멍청한 놈입니다.

<html> 
<head> 
    <script type="text/javascript" charset="utf-8" src="js/jquery-2.0.3.min.js"></script> 
    <script type="text/javascript" src="js/start.js"></script> 
    <script> 
     $(mainFunction()); 
     $('#label1').prop('innerHTML', "test"); 
    </script> 

    <title></title> 
</head> 
<body> 
    <label id="label1"></label> 
</body> 

</html> 

start.js에서, 나는 다음과 같은이 HTML 파일의 요소를 조작하는 것을 시도하고있다.

function start(name){ 
    this.iam = name; 
    this.getName = function(user){ 
     return this.iam; 
    } 
} 

function mainFunction(){ 
    var label = $('#label1'); 
    var oStart = new start("test"); 
    label.prop("innerHTML" ,oStart.getName("test")); 
} 

을 나는 위의 코드에 '라벨'에 무슨 일을 조회 할 때, 나는 []를 인쇄하세요 콘솔. 내가 뭘 잘못하고 있니?

답변

3

$(mainFunction());이 문제가됩니다. 대신 document.ready에 대한 함수 참조를 제공하십시오. 이처럼

:

$(mainFunction); 

가 너무 일찍 DOM 트리가 구축되기 전에 실행됩니다 의미 핸들러를 설치하는 동안이 기능 mainFunction를 호출 할 $(mainFunction());하는 동안.

$(function(){ 
    mainFunction(); 
}); 

이 또한 그냥 body 태그가 끝나기 전에 스크립트를 이동하는 경우이 문제가 발생하지 않습니다 기억 :

또는 당신이 할 수있는 혼란을 피하기 위해

. 문서 준비 처리기를 청취 할 필요가 없습니다. 더하기, 그냥 할 수있는 속기로 label.html(oStart.getName("test"));

+0

감사합니다. 그건 간단했다. – Zeus

3

jQuery를 사용하기 전에 DOM 준비가 완료 될 때까지 기다려야합니다.

$(document).ready(function() { 
    // All your code touching the DOM in here 
}); 

는 또한이 라인이 있습니다 : $(mainFunction());mainFunction의 반환 값을 사용하여 DOM이 준비가되면, 그것을 실행되지 않습니다

이이 방법을 수행합니다.