您的位置：首页 > 编程语言 > ASP

学习 ASP.NET AJAX深入浅出系列课程(21)：利用Microsoft AJAX Library开发客户端组建(上)(Level 300)

2010-04-07 23:41 881 查看
今天学习21课了！……

直接贴代码,根据我的理解写的注释,不保证全对,如果有哪里说错了,望各位仁兄提出,加以改正!谢谢

///<referencename="MicrosoftAjax.js"/>
//注册namespaceDemo
Type.registerNamespace("Demo");

Demo.Timer=function(){
///<summary>Timer组件</summary>
Demo.Timer.initializeBase(this);
this._interval=1000;
this._timer=null;
}
Demo.Timer.prototype={
///<summary>获取_interval值</summary>
get_interval:function(){
returnthis._interval;
},
///<summary>设置_interval值</summary>
set_interval:function(value){
if(this._interval!=value){
this._interval=value;
//debugger;
//如果注释下面一句则不会触发propertyChanged事件
this.raisePropertyChanged("interval");
if(this._timer){
this.stop();
this.start();
}
}
},
///<summary>添加tick事件</summary>
add_tick:function(handler){
this.get_events().addHandler("tick",handler);
},
///<summary>删除tick事件</summary>
remove_tick:function(handler){
this.get_events().removeHandler("tick",handler);
},
///<summary>回调函数</summary>
_timerCallback:function(){
//获取tick函数
varhandler=this.get_events().getHandler("tick");
if(handler){
handler(this,Sys.EventArgs.Empty);
}
},
///<summary>Timer开始</summary>
start:function(){
if(this._interval>0){
//createDelegate这个老赵以前讲过的,不是很理解
this._timer=window.setInterval(Function.createDelegate(this,this._timerCallback),this._interval);
}
},
///<summary>Timer停止</summary>
stop:function(){
if(this._timer){
window.clearInterval(this._timer);
this._timer=null;
}
}
};
///<summary>注册类</summary>
Demo.Timer.registerClass("Demo.Timer",Sys.Component);



以上脚本保存为js/timer.js.

Page

<%@PageLanguage="C#"AutoEventWireup="true"CodeFile="1_ajaxLibray.aspx.cs"Inherits="ajax_1_ajaxLibray"%>

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">
<headrunat="server">
<title>AJAXLibray</title>
</head>
<body>
<formid="form1"runat="server">
<asp:ScriptManagerrunat="server"ID="sm">
<Scripts>
<asp:ScriptReferencePath="~/js/timer.js"/>
</Scripts>
</asp:ScriptManager>
<scripttype="text/javascript">
//页面周期[以下数字为执行顺序,并不是按照写js的顺序来执行的]
/*Sys.Application.add_unload(function(){alert("Page_unload");});//3
Sys.Application.add_load(function(){alert("Page_load");});//2
Sys.Application.add_disposing(function(){alert("page_disposing");});//4
Sys.Application.initialize();
Sys.Application.add_init(function(){alert("Page_init");});//1
*/
</script>
<divid="display">
</div>
Interval:
<inputvalue="1000"id="txtInterval"/>
<inputtype="button"value="change"onclick="ChangeInterval();"/>
<spanid="shwoInterval"></span>
<scripttype="text/javascript">
//页面初始化化时
Sys.Application.add_init(function(){
//创建组件
/*
id:timer,作为组件的属性,以便后面使用$find("timer")找到该主键
tick:onTick,varhandler=this.get_events().getHandler("tick");和这句有联系
调用start(),函数其实就是执行onTick()函数,注意看Timerjs里面的start()函数
*/
$create(Demo.Timer,{"id":"timer"},{"tick":onTick,"propertyChanged":onPropertyChanged});
});
functionChangeInterval(){
varvalue=parseInt($get("txtInterval").value,10);
//debugger;--调试时发现少写了.value
$find("timer").set_interval(value);
/*
因为执行set_interval时里面有执行
this.raisePropertyChanged("interval");
所以又会触发onPropertyChanged()事件,
我试过如果注释this.raisePropertyChanged("interval");
则不会触发onPropertyChanged事件
*/

}
varcount=0;
functiononTick(){
$get("display").innerHTML=++count;
}
//这个函数(怎么就知道有2个参数呢？疑惑)
functiononPropertyChanged(sender,args){
//debugger;
varproperty=args.get_propertyName();
//debugger;
varvalue=sender["get_"+property].apply(sender);
$get("shwoInterval").innerHTML=property+"改变成了"+value;
}
//Load事件
functionpageLoad(){
$find("timer").start();
}
</script>
</form>
</body>
</html>



明天继续学习…,坚持每天一个视频！还需要学习其他的呢?
最近还要考试sharepoint,全是英文!头痛！


//varOB_langJS='http://widgets.outbrain.com/lang_chi.js'
varOBITm='1270567224412';
varOB_raterMode='stars';
varOB_recMode='rec';
varOutbrainPermaLink='http://www.cnblogs.com/jinho';

if(typeof(OB_Script)!='undefined')
OutbrainStart();
else{
varOB_Script=true;
varstr='<\/script>';
document.write(str);
document.write("");
}
//]]>
Technorati标签:ajax
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航