2012-10-08 4 views
1

Grails와 관련된 것이 무엇인지, 또는 무엇이 문제인지는 확실치 않습니다.Grails - 스크립트 실행 후 body onload 호출

나는 내가 처음가는 몸의 하중에 호출 할 방법이있다. 그런 다음 스크립트 태그에서 두 번째로 이동하는 메소드입니다. 나는 항상 body onload 메서드가 먼저 호출 될 것이라고 생각했다 - 나는 틀렸다고 생각한다.

경고 순서는 3, 1, 2입니다.

아이디어가 있으십니까?

<html> 
<head> 
    <title>${cname} Organization Chart</title> 

    <link rel="stylesheet" href="${resource(dir: 'css', file: 'custom.css')}" type="text/css"/> 
    <link rel="stylesheet" href="${resource(dir: 'css', file: 'jquery.jOrgChart.css')}" type="text/css"/> 
    <link rel="stylesheet" href="${resource(dir: 'css', file: 'bootstrap.min.css')}" type="text/css"/> 
    <link rel="stylesheet" href="${resource(dir: 'css', file: 'prettify.css')}" type="text/css"/> 

    <g:javascript src="prettify.js" /> 
    <g:javascript src="jquery.jOrgChart.js" /> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script> 

    <script> 
     alert('3'); 
     jQuery(document).ready(function() { 
      $("#org").jOrgChart({ 
       chartElement : '#chart', 
       dragAndDrop : true 
      }); 
     }); 
    </script> 

<body onload="alert('1');prettyPrint();alert('2');"> 

    <ul id='org' style='display:none'></ul> 

    <div id="chart"></div> 
</body> 
</html> 

답변

3

<body onload=...> 실제로 (이상하게)(이미지, 스크립트 등)이로드가 완료 모든 초기 요청 외부 리소스 후에 호출되는 window.onload 이벤트를 설정합니다.

당신은 아마 jQuery의 $(document).ready() 핸들러를 사용하거나 필요에 따라 스크립트를 인라인한다.

1

온로드 이벤트는 웹 페이지가 완전히 모든 컨텐츠를로드 할 때 페이지가 해고 loaded.This을하고있다 직후 발생합니다.

스크립트 태그 안에있는 사람은 즉시 파서가 그것을 발견으로 발생합니다.

그래서 경고 해고되는 순서는 완벽하게 정상입니다.

1

최선의 선택은 자바 스크립트 파일에 자바 스크립트를 모두 넣고 HTML에서 어떤을 실행하지하는 것입니다.

HTML :

<html> 
    <head> 
     <title>${cname} Organization Chart</title> 
     ... snip ... 
     <script type="text/javascript" src="someJSFile.js" /> 
    </head> 
    <body> 
     <ul id='org' style='display:none'></ul> 
     <div id="chart"></div> 
    </body> 
</html> 

someJSFile.js :

$(document).ready(function() { 
    prettyPrint(); 

    $("#org").jOrgChart({ 
     chartElement: '#chart', 
     dragAndDrop: true 
    }); 
}); 
관련 문제