logo标签列表

为什么Dojo 1.7不能显示对话框？

javascriptdojo
5
我按照dojo教程创建了一个“条款和条件”对话框。使用的是1.7.0版本的dojo。我在chrome浏览器中进行了测试，在测试页面上右键单击以显示菜单，然后选择“检查元素”选项。我在控制台标签页中发现了一个错误消息。错误消息为:
Uncaught TypeError: Cannot call method 'show' of undefined
showDialogdialog
(anonymous function)
onclickdialog

我前往Dojo API页面。我发现在dojo 1.7.0版本下，类dijit.Dialog没有任何方法。那么如何使用dojo 1.7.0来显示对话框？有什么想法吗？非常感谢。

3个回答
4
似乎是Google CDN存在问题，因为使用本地副本的Dojo 1.7教程示例可以正常工作。
Dojo加载器加载了Dialog.js文件，但无法解析它，导致“parser.js:8 Uncaught Error: Could not load class 'dijit.Dialog'”。
由于未实例化Dialog小部件，dijit.Dialog.show()方法丢失，并且dijit.byId("terms")返回“undefined”。
为了解决这个问题，请通过脚本标签加载dijit.Dialog类/文件。
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.7.0/dijit/Dialog.js"></script>

我将这个问题提交到了Dojo的Bug跟踪器中：Ticket #14415。
0

我尝试过 Dojo 1.7.1 并且它可以使用这段代码运行http://jsfiddle.net/nv4YC/Dojo 1.7.0 也能工作。

从您提供的链接（Dojo 教程）来看 需要进行更改

dojo.require("dijit.Dialog");

脚本标签应该有async: true

像这样data-dojo-config="async: true, parseOnLoad:true"

让我们看看我的jsfiddle或者尝试这段代码

<head>
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dijit/themes/claro/claro.css">
    <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dojo/dojo.js"
    data-dojo-config="async: true, parseOnLoad:true"></script>
    <script>
        require(["dijit/registry", "dijit/Dialog"], function (registry)
        {
            // Show the dialog
            showDialog = function showDialog()
            {
                registry.byId("terms").show();
            }
            // Hide the dialog
            hideDialog = function hideDialog()
            {
                registry.byId("terms").hide();
            }
        });
    </script>
</head>

<body class="claro">
    <button onclick="showDialog();">View Terms and Conditions</button>
    <div class="dijitHidden">
        <div data-dojo-type="dijit.Dialog" style="width:600px;" data-dojo-props="title:'Terms and Conditions'"
        id="terms">
            <p>
                <strong>Please agree to the following terms and conditions:</strong>
            </p>
            <div style="height:160px;overflow-y:scroll;border:1px solid #769dc4;padding:0 10px;width:600px">
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sed suscipit
                    massa. Aenean vel turpis tincidunt velit gravida venenatis. In iaculis
                    urna non quam tincidunt elementum. Nunc pellentesque aliquam dui, ac facilisis
                    massa sollicitudin et. Donec tincidunt vulputate ultrices. Duis eu risus
                    ut ipsum auctor scelerisque non quis ante. Nam tempor lobortis justo, et
                    rhoncus mauris cursus et. Mauris auctor congue lectus auctor ultrices.
                    Aenean quis feugiat purus. Cras ornare vehicula tempus. Nunc placerat,
                    lorem adipiscing condimentum sagittis, augue velit ornare odio, eget semper
                    risus est et erat....</p>
            </div>
            <button onclick="hideDialog();">I Agree</button>
            <button onclick="alert('You must agree!');">I Don't Agree</button>
        </div>
    </div>
</body>

0
从错误信息来看，对话框对象是“undefined”。您仍然使用“show”函数来显示一个“dijit.Dialog”。请仔细检查“dijit.Dialog”实例是否成功创建。
示例代码：
var dlg = new dijit.Dialog({
    id: "myDialog",
    title: "Sample",
    content: "<div>Hello World!</div>"
});
dlg.show();

你在 API 文档中看不到 show 函数的原因是因为这个 show 函数实际上是在一个内部类 dijit._DialogBase 中声明的。

似乎API工具应该捕获继承的方法（并在绿色“in”按钮打开时显示它们）。听起来像是另一个错误，可能与AMD转换相关。 - peller
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接