0

dojo 1.5を使用し、ローカルフォルダー（dojo、dijit、dojox）へのパスを参照し、dojo.requireを使用して必要なモジュールをロードするだけで、小さなWebインターフェイスを実装する前は、完全に機能していました。今、私は1.7にアップグレードしましたが、突然、URL参照を使用しても機能しなくなりました。私はデモプロジェクトの1つ http://download.dojotoolkit.org/release-1.7.1/dojo-release-1.7.1/dijit/themes/themeTester.html を参照しており、いくつかの変更を加えてページを再作成することを望んでいました。 。私はそれをメインメニューだけを持っていることによって最も単純な形に分解しました、そしてそれはそのように表示されませんが、ちょうどお互いの下の単なるテキスト用語として表示されます。

    <meta http-equiv="Content-type" content="text/html; charset=utf-8">

<title>Theme Previewer</title>


<script type="text/javascript" dojoConfig="parseOnLoad:false, 
      async:true"  
     src="http://ajax.googleapis.com/ajax/libs/dojo/1.7.2/dojo/dojo.js" > </script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7.2/dijit/themes/claro/document.css"/>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7.2/dijit/themes/claro/claro.css"/>
<link rel="stylesheet" href="Styles/demo.css"/>


     <script type="text/javascript">
    var dojoConfig = {
        baseUrl: "//ajax.googleapis.com/ajax/libs",
        tlmSiblingOfDojo: false,
        packages: [
        { name: "dojo", location: "//ajax.googleapis.com/ajax/libs/dojo/1.7.1/" },
        { name: "dijit", location: "//ajax.googleapis.com/ajax/libs/dojo/1.7.1/" },
        { name: "dojox", location: "//ajax.googleapis.com/ajax/libs/dojo/1.7.1/" }
        ]
    };
</script>
  <!--script type="text/javascript" src="Scripts/src.js"></script-->

  </head>
  <body class="claro">
<div id="main" data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'sidebar', gutters:=false">

    <div id="header" data-dojo-type="dijit.MenuBar" data-dojo-props="region:'top'">
        <div data-dojo-type="dijit.PopupMenuBarItem" id="edit">
            <span>Edit</span>
            <div data-dojo-type="dijit.Menu" id="editMenu">
                <div data-dojo-type="dijit.MenuItem" id="cut" data-dojo-props="
                    iconClass:'dijitIconCut'
                ">Cut</div>
                <div data-dojo-type="dijit.MenuItem" id="copy" data-dojo-props="
                    iconClass:'dijitIconCopy'
                ">Copy</div>
                <div data-dojo-type="dijit.MenuItem" id="paste" data-dojo-props="iconClass:'dijitIconPaste'">Paste</div>
                <div data-dojo-type="dijit.MenuSeparator" id="separator"></div>
                <div data-dojo-type="dijit.MenuItem" id="undo" data-dojo-props="iconClass:'dijitIconUndo'">Undo</div>
            </div>
        </div>
        <div data-dojo-type="dijit.PopupMenuBarItem" id="view">
            <span>View</span>
            <div data-dojo-type="dijit.Menu" id="viewMenu">
                <div data-dojo-type="dijit.MenuItem">Normal</div>
                <div data-dojo-type="dijit.MenuItem">Outline</div>
                <div data-dojo-type="dijit.PopupMenuItem">
                    <span>Zoom</span>
                    <div data-dojo-type="dijit.Menu" id="zoomMenu">
                        <div data-dojo-type="dijit.MenuItem">50%</div>
                        <div data-dojo-type="dijit.MenuItem">75%</div>
                        <div data-dojo-type="dijit.MenuItem">100%</div>
                        <div data-dojo-type="dijit.MenuItem">150%</div>
                        <div data-dojo-type="dijit.MenuItem">200%</div>
                    </div>
                </div>
            </div>
        </div>
        <div data-dojo-type="dijit.PopupMenuBarItem" id="themes">
            <span>Themes</span>
            <div data-dojo-type="dijit.Menu" id="themeMenu"></div>
        </div>
        <div data-dojo-type="dijit.PopupMenuBarItem" id="dialogs">
            <span>Dialogs</span>
            <div data-dojo-type="dijit.Menu" id="dialogMenu">
                <div data-dojo-type="dijit.MenuItem" data-dojo-props="onClick: showDialog">slow loading</div>
                <div data-dojo-type="dijit.MenuItem" data-dojo-props="onClick: showDialogAb">action bar</div>
            </div>
        </div>
        <div data-dojo-type="dijit.PopupMenuBarItem" id="inputPadding">
            <span>TextBox Padding</span>
            <div data-dojo-type="dijit.Menu" id="inputPaddingMenu">
                <div data-dojo-type="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding, checked:true">theme default</div>
                <div data-dojo-type="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding">0px</div>
                <div data-dojo-type="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding">1px</div>
                <div data-dojo-type="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding">2px</div>
                <div data-dojo-type="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding">3px</div>
                <div data-dojo-type="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding">4px</div>
                <div data-dojo-type="dijit.CheckedMenuItem" data-dojo-props="onClick:setTextBoxPadding">5px</div>
            </div>
        </div>
        <div data-dojo-type="dijit.PopupMenuBarItem" id="help">
            <span>Help</span>
            <div data-dojo-type="dijit.Menu" id="helpMenu">
                <div data-dojo-type="dijit.MenuItem">Help Topics</div>
                <div data-dojo-type="dijit.MenuItem">About Dijit</div>
            </div>
        </div>
        <div data-dojo-type="dijit.PopupMenuBarItem" data-dojo-props="disabled:true">
            <span>Disabled</span>
            <div data-dojo-type="dijit.Menu">
                <div data-dojo-type="dijit.MenuItem">You should not see this</div>
            </div>
        </div>
    </div>

    </div>

含めるアイテムを参照する別のファイルがあります。

define([
"dojo/_base/array",
"dojo_base/config",
"dojo/dom",
"dojo/dom-class",
"dojo/dom-construct",
"dojo/_base/kernel",
"dojo/query",
"dojo/ready",
"dojo/_base/window",
"dojo/_base/fx",
"dijit/registry",
"dijit/MenuItem",
"dojo/date/locale",
"dojo/parser",
"dojo/data/ItemFileReadStore",
"dijit/tree/ForestStoreModel",
"dojo/number", //// dojo/number/format
"dojo/dnd/Source",// // dojo/dnd/Source
"dojo/_base/json", //// dojo/toJson
  "dojox/grid/DataGrid",
    "dojo/data/ItemFileReadStore",
    "dojo/parser",
    "dijit/form/DateTextBox",
    "dojox/widget/AnalogGauge",
    "dijit/layout/ContentPane",
    "dijit/layout/TabContainer",
    "dijit/layout/BorderContainer",
    "dijit/layout/AccordionContainer",
    "dijit/form/Button",
    "dojox/widget/AnalogGauge",
    "dojox/widget/gauge/AnalogArcIndicator",
    "dojox/widget/gauge/AnalogNeedleIndicator",
    "dojox/widget/gauge/AnalogArrowIndicator",
    "dijit/MenuBar",
    "dijit/PopupMenuBarItem",
    "dijit/Menu",
    "dijit/MenuItem",
    "dijit/Tree",
    "dijit/MenuSeparator",
    "dijit/Calendar",
    "dijit/ColorPalette",
"dijit/dijit-all" // dijit.*
["dojo/dom", "dojo/domReady!"], function(dom){
var greeting = dom.byId("greeting");
greeting.innerHTML += " from Dojo!";
}]);

これが少し明確になることを願っています。

4

1 に答える 1

2

貼り付けたHTMLは、Dojoをプルするときに'parseOnLoad：false'を指定します。これにより、明示的にparser.parse（）を呼び出さない限り、Dojoが実際にdata-dojo-typeを解析できなくなります。'parseOnLoad：true'に変更すると、役に立ちますか？（これはもはや推奨される方法ではありませんが、試してみると便利です。）

また、HTMLにDojo 1.7.2と1.7.1の参照が混在しているようですが、これは少し奇妙です。そのdojoConfigが必要ですか？Dojoは、CDN上でもdojoディレクトリの兄弟としてdijit+dojoxを見つけることができるはずです。

しかし、「機能しない」が実際に何を意味するのかを知ることは間違いなく役立ちます。エラーが発生し、コンテンツが表示されませんか？


後で答えるための追加：

  1. ローカルファイルではなく、Webサーバーからファイルを実行していることを確認してください。そうしないと、XHRリクエストが失敗します。
  2. dojoConfigオブジェクトを削除します：それは役に立ちません
  3. あなたの別のファイルは危険に見えます：あなたはいくつかの奇妙な配列ブラケットが起こっています
  4. トップdivのdata-dojo-propsが少し壊れています。「gutters：= false」ではなく、「gutters：'false'」と記述します

これをHTMLに追加します。適切なモジュールをロードし、パーサーを手動で開始します。

<script>
require(["dojo/parser", "dijit/dijit-all", "dojo/domReady!"], function(parser) {
  parser.parse();
});
</script>

onClickハンドラー関数を追加するまで完全には機能しませんが、メニュー項目が表示されます。

最後に、ブラウザコンソールでエラーと警告を確認してください。これにより、将来の問題を診断するのに役立つ多くの出力が提供されます。また、モジュールの読み込みで問題が発生した場合は、非同期をオフに切り替えてみてください。非同期では診断が難しくなることがあるためです。

于 2012-05-02T10:51:44.413 に答える