繁體中文当前位置: 首页 > 图文教程 > 网络编程 > Javascript > Dojo 学习笔记入门篇 First Dojo Example
- Javascript
- javascript options属性集合操作代码
- javascript 鼠标悬浮图片显示原图 移出鼠标后原图消失（多图）
- javascript 显示当前系统时间代码
- firefox和IE系列的相关区别整理 以备后用
- extJs 常用到的增，删，改，查操作代码
- Javascript 面向对象特性
- JavaScript的public、private和privileged模式
- 通过javascript设置css属性的代码
- javascript iframe编程相关代码
- 滚动条变色 隐藏滚动条与双击网页自动滚屏显示代码
- js DOM模型操作
- js 学习笔记（三）
- 用js做一个小游戏平台 (一)
- jquery UI 1.72 之datepicker
- jQuery的三种$()
- JavaScript 常用函数
- 用javascript实现源代码的隐藏与解密的方法
- javascript Onunload与Onbeforeunload使用小结
- Javascript的闭包
- JavaScript 对Cookie 操作的封装小结
Javascript 中的 Dojo 学习笔记入门篇 First Dojo Example
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2010-01-10 浏览: 106 ::
收藏到网摘: n/a
Dojo学习笔记入门篇，第一个小例子， 刚开始学习dojo的朋友可以参考下。 Step 1： Configurate Dojo
从http://www.dojotoolkit.org/downloads 下载最新的Dojo包，并且放到你工程的某一个地方。比如，我就放把我的dojo库放在lib文件夹下（如图一）。
图一（文件目录结构）
在你的页面中加入如下代码，那么就完成了最基本的配置。
<script type="text/javascript" src="lib/dojo/dojo/dojo.js" djConfig ="parseOnLoad:true, isDebug:false"></script>
Step 2: Start your First Example
我的第一个例子是模拟一个简单的登录页面，如果成功，则显示“Right！”，反之则显示“Wrong！Please try it again！”
复制代码 代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script type="text/javascript" src="lib/dojo/dojo/dojo.js" src="lib/dojo/dojo/dojo.js" djConfig ="parseOnLoad:true, isDebug:false"></script>
<style type="text/css"><!--
#container {
border: 1px dotted #b7b7b7;
background: #ededed;
width: 200px;
height: 200px;
}
--></style><style type="text/css" bogus="1"> #container {
border: 1px dotted #b7b7b7;
background: #ededed;
width: 200px;
height: 200px;
}
</style>
</head>
<body>
<form id="mainForm" action="controller/ajax-controller.php" method="post">
<label for = "name">Name:</label>
<input type="text" name="name"/>
<br/>
<label for = "password">Password:</label>
<input type="password" name="password" value=""/>
<br/>
<input type="submit" value="Submit"/>
<h1 id="resultText"></h1>
</form>
<script type="text/javascript"><!--
var formSubmit = function(e){
e.preventDefault();
var resultText = dojo.byId("resultText");
dojo.xhrPost({
url: "controller/controller.php",
form:"mainForm",
handleAs:"text",
handle:function(data,args){
console.info(data);
if(typeof data=="error"){
resultText.innerHTML = "<font color=\"red\">error!</font>";
}else{
if(data === "right"){
resultText.innerHTML = "Right!";
}else if(data==="wrong"){
resultText.innerHTML = "<font color=\"red\">Wrong!Please try it again!</font>";
}
}
}
});
};
dojo.addOnLoad(function(){
var theForm = dojo.byId("mainForm");
dojo.connect(theForm,"onsubmit","formSubmit");
});
// --></script>
</body>
</html>
（对于其中的Dojo方法，可以查看Dojo的API，在此不再赘述）
后台采用php，代码如下：
复制代码 代码如下:
<?php
if($_POST["name"] == "blithe" && $_POST["password"]=="blithe"){
print "right";
}else{
print "wrong";
}
?>
评论 (0) All
