1

何が原因なのか、それとも Grails に関連しているのかはよくわかりません。

最初に実行されるボディ ロードで呼び出したいメソッドがあります。次に、2 番目の script タグ内のメソッド。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>
4

3 に答える 3

3

<body onload=...>実際には(そして奇妙なことに)イベントを設定します。このwindow.onloadイベントは、最初に要求されたすべての外部リソース(画像、スクリプトなど)の読み込みが完了した後に呼び出されます。

必要に応じて、おそらく jQuery の$(document).ready()ハンドラーを使用するか、スクリプトをインライン化する必要があります。

于 2012-10-08T19:45:05.740 に答える
2

最良のオプションは、JavaScript ファイルにすべての JavaScript を配置し、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
    });
});
于 2012-10-08T19:49:50.510 に答える
1

onloadイベントは、ページがロードされた直後に発生します。これは、Web ページがすべてのコンテンツを完全にロードしたときに発生します。

script タグ内のものは、パーサーがそれに遭遇するとすぐに起動されます。

したがって、アラートが発生する順序は完全に正常です。

于 2012-10-08T19:44:51.630 に答える