Dojo基本知识

引入dojo.js
<script type="text/javascript" src="../dojo/dojo.js" djConfig="isDebug:false, parseOnLoad:false">
// isDebug 为是否打开调式窗口

 

使用dojo
dijit.byId，dojo.byId // 其中dijit.byId 更准确更常用
var kana ="test";
// 设值
dijit.byId("username").attr("value",kana);
// 取值
kana = dijit.byId("username").attr("value");

dojo.byId等同于常用的document.getElement
<input type="text" name="username" id="username" value="Mark" />
<script type="text/javascript">
var username = dojo.byId('username').value
alert(username);
</script>

 

dojo.addOnLoad
等同于window.onload,画面加载后自动调用的方法
dojo.addOnLoad(function(){
    dijit.byId("testText").attr("value","hello world");
});

 

dojo.connect
用于监听普通的DOM事件
<script type="text/javascript">
function sayHello(event)
{
    alert("Hello World");
}
dojo.addOnLoad(function(){  
    var btn = dojo.byId('testbtn');  
    dojo.connect(btn,"onclick",sayHello);
});  
</script>
<input type="button" id="testbtn"/>

等同于:<input type="button" id="testbtn" οnclick="sayHello()"/>

传参数：
var name = "Mark"
function sayHello()
{  
    alert("Hello " + this.name);
}
var obj = {
    name: "Karl"
}  
dojo.addOnLoad(function(){
    var btn = dojo.byId('hello');
    dojo.connect(btn,"onclick",obj,sayHello);//注意这行的第三个和第四个参数  
});
OK，点击按钮，将输出：Hello Karl

 

Dojo的Ajax技术

dojo默认绑定为utf-8设置，只需要修改一下引入dojo.js时的标签，bindEncoding:'UTF-8'
<script type="text/javascript" src="./dojo-lib/dojo/dojo.js" djConfig="isDebug:true,bindEncoding:'UTF-8'"></script>
dojo.xhrGet 和 dojo.xhrPost 下面以dojo.xhrPost为例
var params = {username:'test',id:'105'}
function loadAjax(){
    dojo.xhrPost({
        url: loadajax.jsp,    // 请求提交路径
        content:params,       // 传递参数(为json 格式。非必须项目)
        preventCache:true,    // 解决IE缓存问题，自动生成一个timestamp (非必须项目)
        form: 'formId',       // 直接提交一个表单(非必须项目,传参数方式时没必要此项)
        handleAs: "text",     // 把获取的内容(可以是text/html/json)
        load: handleResponse, // 成功时的回调函数
        error: handleError    // 失败时的回调函数
    });
}
function handleResponse(responseText){
    // responseText为后天返回的数据
    alert("处理成功！");
}

function handleError(response){
    alert("处理失败！");
}

 

定义类
dojo.declare("ClsTest",null,{
    constructor:function(name){
        this.name = name;
    },
    getText:function(){
        alert("Hello World！");
    }
    getWords:function(){
        alert("Hello");
    }
});

var clstest = new ClsTest("test");
clstest.say();
// declare 第一个参数 为class名字
// declare 第二个参数 为父类的引用 ，可以是数组，多重继承
// construnctor 为构造函数的

 

继承
dojo.declare("VIP",ClsTest,{
    getText:function(){
        this.inherited(arguments);            // 调用父类的getText方法
        this.inherited("getWords",arguments); // 调用父类的getWords方法
    }
});

 

package机制
dojo.require 引入相应路径文件下的js文件
dojo.require("dijit.Menu");//使用dojo的menu时必须导入
dojo.require("dijit.form.Button");//使用dojo的Button时必须导入
dojo.require("dijit.form.TextBox");//使用dojo的TextBox时必须导入

 

dojo.provide
自己编写的js文件生成package时，在js文件最前端加：
dojo.provide("com.test"); // com.test为package名称

 

dojo.registerModulePath
自己的js文件和dojo没有在同一个目录时使用registerModulePath
dojo.registerModulePath("your js path","dojo js path");

 

实例：

// 重写dijit._tree的onMouseDown方法

dijit._tree.dndSource.prototype.onMouseDown = function(e){
      // summary: event processor for onmousedown
      // e: Event: mouse event
         if(!this.current){ return; }

   var item = dijit.getEnclosingWidget(this.current).item;
   if(!item){return; }
   var id = this.tree.model.getIdentity(item);

   if (!this.current.id) {
    this.current.id=id;
   }
   if(this.current.id == 'SETAI_HOUJIN' || this.current.id == 'SEARCH'){
     return;
   }
      this.mouseDown = true;
      this.mouseButton = e.button;
      this._lastX = e.pageX;
      this._lastY = e.pageY;

      // 调用父类的onMouseDown方法
      this.inherited("onMouseDown",arguments);
     },

 

     // 重写类，继承dijit._TreeNode
     dojo.declare("viewtree.ViewTreeNode",
                dijit._TreeNode,
                {
                setLabelNode: function(label){

                    this.labelNode.innerHTML = label;
                }
                }
        );