dijit.byId 不起作用（不是函数吗？）
Posted
技术标签:
【中文标题】dijit.byId 不起作用（不是函数吗？）【英文标题】：dijit.byId not working(is not a function?) 【发布时间】：2014-01-24 10:54:54 【问题描述】：这是我的简单道场示例：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.2/dijit/themes/dijit.css">
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.2/dijit/themes/claro/claro.css">
<title>ShowMovies </title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript" data-dojo-config="isDebug: false, async: true, parseOnLoad: true" src="http://ajax.googleapis.com/ajax/libs/dojo/1.9.2/dojo.js"></script>
<script type="text/javascript">
require(
[ "dojo", "dojo/parser", "dijit/layout/BorderContainer",
"dijit/layout/ContentPane", "dojox/grid/DataGrid",
"dojo/data/ItemFileReadStore" ],
function(dojo)
dojo.ready(function()
dojo.xhrGet(
url : "MovieList.json",
handleAs : "json",
load : function(response, ioArgs)
var newData =
identifier: "title",
items: response.result
;
var dataStore = new dojo.data.ItemFileReadStore(data: newData, id:"dataStoreId");
var grid = dijit.byId("gridId");
grid.setStore(dataStore);
,
error : function(response, ioArgs)
alert(response);
);
);
);
</script>
<link rel="stylesheet" type="text/css" title="Style" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.2/dojox/grid/resources/Grid.css">
<link rel="stylesheet" type="text/css" title="Style" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.2/dojox/grid/resources/claroGrid.css">
</head>
<body class="claro">
<div id="BorderContainer" style="height: 100%; width: 100%"
data-dojo-type="dijit.layout.BorderContainer"
data-dojo-props="design:'headline'">
<div data-dojo-type="dijit.layout.ContentPane"
data-dojo-props="region:'top'" style="text-align: center">My Movie Web Application!</div>
<div data-dojo-type="dijit.layout.ContentPane"
data-dojo-props="region:'center'">
<table id="gridId" auto
data-dojo-type="dojox.grid.DataGrid"
data-dojo-props="rowSelector:'20px'">
<thead>
<tr>
<th field="title">Title</th>
<th field="director">Director</th>
<th field="actor">Actor</th>
<th field="description">Description</th>
</tr>
</thead>
</table>
</div>
<div data-dojo-type="dijit.layout.ContentPane"
data-dojo-props="region:'right'"></div>
</div>
</body>
</html>
为什么我收到 xhrGet 请求错误？响应是：dijit.byid 不是函数
谢谢
【问题讨论】：
【参考方案1】：快速回答是：当您的 Dojo 配置中有 async:true 时，您的 Javascript 代码中可能不应该有任何以 dojo. 或 dijit. 开头的内容。
在过去的 Dojo 1.5 及更早版本中，Dojo 及其模块的工作方式与现在略有不同。
那时，您可以包含 dojo.js 并立即拥有一系列方便的功能，例如dojo.create、dojo.connect、dojo.xhrGet、dijit.byId 等等。如果您想包含一些额外的模块或小部件，您可以使用dojo.require，然后使用dojo.some.thing 或dijit.other.thing 引用该模块。
在较新版本的 Dojo 中，当您在页面中包含 dojo.js 时，您实际上只能获得两个函数：require 和 define。您可以使用这些功能“导入”您需要的所有内容。即使对于像dojo.create 这样小的东西，您也必须导入一个模块。
一开始，您可能会觉得这很不方便。如果您对 Dojo 采取这个方向的原因及其好处感兴趣，可以查看此slideshare。
回到您的代码。你有async:true 和很多dojo. 和dijit. 语句。这里有 3 种方法可以解决它：
将 async:true 更改为 false。这使得 Dojo 以“旧”样式处理代码，即您的 dojo. 和 dijit. 应该仍然可以工作。
保留async:true，但导入特殊的dijit/dijit 模块，这使得旧的dijit. 功能可用。所以你的第一行将是这样的：
require(["dojo","dijit/dijit",....], function(dojo, dijit, ...)
（“dojo”模块也是一个允许“旧”风格的特殊模块。）
将您的代码重写为全新的 AMD 风格。这意味着对于每个dojo. 和dijit.，您需要找出需要导入的模块。如果您已经有很多 Dojo 代码，这将是一些工作。您问题中的代码如下所示：http://fiddle.jshell.net/8DETs/
您可能在想：为每件小事加载文件/模块一定很慢！你是对的。这个想法是，当您在本地开发时，它会足够快，并且当您部署您的 Web 应用程序时，您将使用 Dojo 的构建工具在很少的文件中创建一个精益包。这是 Dojo 的绝对优势之一，您可以在此处阅读更多信息：http://dojotoolkit.org/documentation/tutorials/1.9/build/
【讨论】：
非常感谢您的详细解答！！你帮了我很多！以上是关于dijit.byId 不起作用（不是函数吗？）的主要内容，如果未能解决你的问题，请参考以下文章
使用 dijit.byId w dojox.mobile 小部件
dojo.byId() 有效，但 dijit.byId() 无效
如何禁用“dijit.form.FilteringSelect”小部件？