1

Dojoダイアログボックスの簡単な例をコーディングしようとしています。Dojoリファレンスに示されている例をここにコピーしました=> http://dojotoolkit.org/reference-guide/1.7/dijit/Dialog.html

私のコードを以下に示します。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
        <title>Dialog Test</title>
        <script language="JavaScript" type="text/javascript">
                dojo.require("dojo.parser");
                dojo.require("dojox.widget.Dialog");
                dojo.require("dijit.form.Button");
                dojo.require("dijit.layout.TabContainer")
                dojo.require("dijit.layout.ContentPane")
        </script>
    </head>
    <body>
        <div id="dialogOne" dojoType="dojox.widget.Dialog" title="My Dialog Title">
            <div dojoType="dijit.layout.TabContainer" style="width: 200px; height: 300px;">
                <div dojoType="dijit.layout.ContentPane" title="foo">Content of Tab "foo"</div>
                <div dojoType="dijit.layout.ContentPane" title="boo">Hi, I'm Tab "boo"</div>
            </div>
        </div>
        <p>When pressing this button the dialog will popup:</p>
        <button id="buttonOne" dojoType="dijit.form.Button">Show me!
            <script type="dojo/method" event="onClick" args="evt">
                // Show the Dialog:
                dijit.byId("dialogOne").show();
            </script>
        </button>
    </body>
</html>

ページがブラウザに読み込まれると、ダイアログは機能しません。タブ付きペインのテキストがブラウザに表示されるのがわかります。

リファレンスガイドからコードを正確にコピーしたので、非常に混乱しています。助言がありますか？

ありがとう。

ジェームズ。

4

1 に答える 1

0

残念ながら、Dojo サンプルは「そのまま」では完全に機能しない傾向がありますが、さまざまな標準的な形式でまとめる必要があるスケルトン コードの一部です。

これが機能せず、正しくレンダリングされない原因が少なくとも 3 つあります。上に他の問題があるかもしれませんが、これらは間違いなくレンダリングしない原因となります:

  1. コア Dojo スクリプトのバージョンにリンクする必要があります。CDN バージョンへのリンクは簡単な方法です。例えば<script src="//ajax.googleapis.com/ajax/libs/dojo/1.8.3/dojo/dojo.js"></script>。詳細はこちら: http://dojotoolkit.org/download/ . requireこれを必ずスクリプトの前に置いてください。
  2. ページに Dijit テーマ スタイル シート (CSS ファイル) へのリンクを追加します。そうしないと、どのウィジェットも正しく表示されません。例えば<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.8.3/dijit/themes/claro/claro.css‌​"/>
  3. 使用するテーマを説明する body 要素に属性を追加しclassます。例えば<body class="claro">。

これら 3 つのことをすべて行った場合にのみ、機能する可能性があります。他にも問題があるかもしれませんが、基本的な 3 つです。

于 2013-01-24T16:53:52.900 に答える