今天在学习Ajax客户端的编程,摆弄了两个多小时。总是出现Type未定义,在网上查了些资料。说是要在web.config里配置ajax参数。最后才找出错误来。原来是JS文件未引入。
学习ajax技术最好装visual studio 2005sp1 版, ASP.NET 2.0 AJAX Extensions,ASP.NET 2.0 AJAX Futures January CTP,AJAX Control Toolkit。否则web.config中会有找不到某个参数的异常。这主要是vs版本以用未使用ajax正式版的原因。
这里仅列举出本人学习过程中的一些心得。希望正欲学习ajax的朋友不要犯我这样的小错误。
1 注册命名空间Demo Type.regitsterNamespace("Demo");
2 Person类的构造函数
3 Person类的方法 要使用JavaScript中的原型prototype机制
4 注册类Person
这四步必不可少,javascript非常难调试。主要原因是自己不熟。呵呵,反正要多写。
下面列举出示例代码。 Namespace.js如下:
//
1 注册命名空间
Type.registerNamespace( " Demo " )
// 2 Person类的构造函数
Demo.Person = function(firstName, lastName, emailAddress) ... {
this._firstName = firstName;
this._lastName = lastName;
this._emailAddress = emailAddress;
}
// 3 Person类的方法 要使用JavaScript中的原型prototype机制
Demo.Person.prototype = ... {
getFirstName: function() ...{
return this._firstName;
},
getLastName: function() ...{
return this._lastName;
},
getName: function() ...{
return this._firstName + " " + this._lastName;
},
getEmailAddress: function()...{
return this._emailAddress;
},
dispose: function() ...{
alert("再见 " + this.getName());
}
}
// 4 注册类Person
Demo.Person.registerClass( " Demo.Person " , null , Sys.IDisposable);
Type.registerNamespace( " Demo " )
// 2 Person类的构造函数
Demo.Person = function(firstName, lastName, emailAddress) ... {
this._firstName = firstName;
this._lastName = lastName;
this._emailAddress = emailAddress;
}
// 3 Person类的方法 要使用JavaScript中的原型prototype机制
Demo.Person.prototype = ... {
getFirstName: function() ...{
return this._firstName;
},
getLastName: function() ...{
return this._lastName;
},
getName: function() ...{
return this._firstName + " " + this._lastName;
},
getEmailAddress: function()...{
return this._emailAddress;
},
dispose: function() ...{
alert("再见 " + this.getName());
}
}
// 4 注册类Person
Demo.Person.registerClass( " Demo.Person " , null , Sys.IDisposable);
Default.aspx代码如下:
<!
DOCTYPE html PUBLIC
"
-//W3C//DTD XHTML 1.0 Transitional//EN
"
" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >
< html xmlns = " http://www.w3.org/1999/xhtml " >
< head >
< title > Namespace </ title >
</ head >
< body onunload = " unload() " >
< form id = " Form1 " runat = " server " >
< asp:ScriptManager ID = " sm " runat = " server " />
</ form >
< div >
< p > MS AJAX注册Javascript命名空间并创建类 </ p >
< input id = " btn " type = " button " value = " Create Demo.Person " onclick = " return btnClick() " />
</ div >
< script type = " text/javascript " src = " Namespace.js " ></ script >
< script type = " text/javascript " language = " JavaScript " >
var ps = new Demo.Person( " Lin " , " Shaoyun " , " boy_clould@163.com " );
function btnClick()
... {
alert(ps.getFirstName()+ " " +ps.getLastName()+" "+ps.getEmailAddress());
return false;
}
function unload()
... {
ps.dispose();
}
</ script >
</ body >
</ html >
" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >
< html xmlns = " http://www.w3.org/1999/xhtml " >
< head >
< title > Namespace </ title >
</ head >
< body onunload = " unload() " >
< form id = " Form1 " runat = " server " >
< asp:ScriptManager ID = " sm " runat = " server " />
</ form >
< div >
< p > MS AJAX注册Javascript命名空间并创建类 </ p >
< input id = " btn " type = " button " value = " Create Demo.Person " onclick = " return btnClick() " />
</ div >
< script type = " text/javascript " src = " Namespace.js " ></ script >
< script type = " text/javascript " language = " JavaScript " >
var ps = new Demo.Person( " Lin " , " Shaoyun " , " boy_clould@163.com " );
function btnClick()
... {
alert(ps.getFirstName()+ " " +ps.getLastName()+" "+ps.getEmailAddress());
return false;
}
function unload()
... {
ps.dispose();
}
</ script >
</ body >
</ html >