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

新瓶旧酒ASP.NET AJAX(7) - 客户端脚本编程(Sys命名空间下的类)

2007-06-22 08:20 344 查看
[索引页]

[源码下载]

[align=center]新瓶旧酒ASP.NET AJAX(7) - 客户端脚本编程(Sys命名空间下的类) [/align]

作者:webabcd

介绍

Sys命名空间是Microsoft AJAX Library的根命名空间。本文主要学习一下其中的Application类、ApplicationLoadEventArgs类、CultureInfo类和StringBuilder类。

关键

1、Application Class

·init事件 - 脚本加载完毕,对象创建之前。

·load事件 - 对象被创建和初始化。可以用pageLoad()

·unload事件 - window.unload时。可以用pageUnload()

·notifyScriptLoaded() - 通知ScriptManager某段脚本已经加载完毕

2、ApplicationLoadEventArgs Class

·components - 最后一次触发load事件时创建的Components

·isPartialLoad - 是否是部分刷新

3、CultureInfo Class

·CurrentCulture字段 - 当前的Culture,返回CurrentCulture对象

·name字段 - Culture的名称

·dateTimeFormat - 获得dateTimeFormat对象,其内有n多格式化类型

·numberFormat - 获得numberFormat对象,其内有n多格式化类型

4、StringBuilder Class

·append(text) - 添加指定字符串到StringBuilder对象的结尾

·appendLine() - 添加一个换行符到StringBuilder对象的结尾

·appendLine(text) - 添加指定字符串到StringBuilder对象的结尾并添加一个换行符

·clear() - 清除StringBuilder对象所有内容

·isEmpty() - StringBuilder对象的内容是否为空

·toString() - 将StringBuilder对象的内容转换为字符串

·toString(separator) - 在StringBuilder对象内的每一个元素的结尾处添加指定字符串

5、其它请查看官方文档

示例

CustomButton.js


Type.registerNamespace("Demo");




Demo.CustomButton = function(element)






{


// 该类继承自Sys.UI.Control,调用基类构造函数


Demo.CustomButton.initializeBase(this, [element]);




this._clickDelegate = null;


this._hoverDelegate = null;


this._unhoverDelegate = null;


}


Demo.CustomButton.prototype =






{


// 定义text属性 - 元素显示的信息


get_text: function()






{


// element - Sys.UI.Control的属性


return this.get_element().innerHTML;


},


set_text: function(value)






{


this.get_element().innerHTML = value;


},




// 添加或移除click事件


add_click: function(handler)






{


// events - Sys.Component的属性


this.get_events().addHandler('click', handler);


},


remove_click: function(handler)






{


this.get_events().removeHandler('click', handler);


},




// 添加或移除hover事件


add_hover: function(handler)






{


this.get_events().addHandler('hover', handler);


},


remove_hover: function(handler)






{


this.get_events().removeHandler('hover', handler);


},




// 添加或移除unhover事件


add_unhover: function(handler)






{


this.get_events().addHandler('unhover', handler);


},


remove_unhover: function(handler)






{


this.get_events().removeHandler('unhover', handler);


},




// 释放资源


dispose: function()






{


var element = this.get_element();




if (this._clickDelegate)






{


// Sys.UI.DomEvent removeHandler()


$removeHandler(element, 'click', this._clickDelegate);


delete this._clickDelegate;


}




if (this._hoverDelegate)






{


$removeHandler(element, 'focus', this._hoverDelegate);


$removeHandler(element, 'mouseover', this._hoverDelegate);


delete this._hoverDelegate;


}




if (this._unhoverDelegate)






{


$removeHandler(element, 'blur', this._unhoverDelegate);


$removeHandler(element, 'mouseout', this._unhoverDelegate);


delete this._unhoverDelegate;


}


Demo.CustomButton.callBaseMethod(this, 'dispose');


},




// 初始化


initialize: function()






{


var element = this.get_element();




if (!element.tabIndex) element.tabIndex = 0;




if (this._clickDelegate === null)






{


// Function.createDelegate用来创建一个调用“this”上下文下的特定函数的委托


this._clickDelegate = Function.createDelegate(this, this._clickHandler);


}


// Sys.UI.DomEvent addHandler()


$addHandler(element, 'click', this._clickDelegate);




if (this._hoverDelegate === null)






{


this._hoverDelegate = Function.createDelegate(this, this._hoverHandler);


}


$addHandler(element, 'mouseover', this._hoverDelegate);


$addHandler(element, 'focus', this._hoverDelegate);




if (this._unhoverDelegate === null)






{


this._unhoverDelegate = Function.createDelegate(this, this._unhoverHandler);


}


$addHandler(element, 'mouseout', this._unhoverDelegate);


$addHandler(element, 'blur', this._unhoverDelegate);




Demo.CustomButton.callBaseMethod(this, 'initialize');


},




// click事件处理器


_clickHandler: function(event)






{


var h = this.get_events().getHandler('click');


if (h) h(this, Sys.EventArgs.Empty);


},


// hover事件处理器


_hoverHandler: function(event)






{


var h = this.get_events().getHandler('hover');


if (h) h(this, Sys.EventArgs.Empty);


},


// unhover事件处理器


_unhoverHandler: function(event)






{


var h = this.get_events().getHandler('unhover');


if (h) h(this, Sys.EventArgs.Empty);


}


}


Demo.CustomButton.registerClass('Demo.CustomButton', Sys.UI.Control);




// 通知ScriptManager这段脚本已经加载完毕


if (typeof(Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();



Application.aspx




<%

@ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="Application.aspx.cs"


Inherits="ClientScripting_Sys_Application" Title="init Event和load Event和unload Event" %>




<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">


<asp:ScriptManagerProxy ID="ScriptManagerProxy1" runat="Server">




<Scripts>



<asp:ScriptReference Path="~/ClientScripting/Sys/CustomButton.js" />


</Scripts>


</asp:ScriptManagerProxy>






<script type="text/javascript">





Sys.Application.add_init(applicationInitHandler);


function applicationInitHandler()






{


// Sys.Component.create()


$create


(


Demo.CustomButton,






{text: '自定义Button(Button1)'},






{click: doClick, hover: doHover, unhover: doUnhover},


null,


$get('Button1')


);




$create


(


Demo.CustomButton,






{text: '自定义Button(Label1)'},






{click: doClick, hover: doHover, unhover: doUnhover},


null,


$get('Label1')


);


}




function doClick(sender, e)






{


Sys.Debug.trace("鼠标点击" + sender.get_id());


}


function doHover(sender, e)






{


Sys.Debug.trace("鼠标经过" + sender.get_id());


}


function doUnhover(sender, e)






{


Sys.Debug.trace("鼠标离开" + sender.get_id());


}






Sys.Application.add_load(applicationLoadHandler);


function applicationLoadHandler(sender, e)






{


alert("ApplicationLoad");


// isPartialLoad - 是否是部分刷新


Sys.Debug.trace('是否是部分刷新:' + e.get_isPartialLoad());


for (var i=0; i<e.get_components().length; i++)






{


// components - 最后一次触发load事件时创建的Components


Sys.Debug.trace('最后一次触发load事件时创建的Component:' + e.get_components()[i].get_id());


}


}






Sys.Application.add_unload(applicationUnloadHandler);


function applicationUnloadHandler()






{


alert('ApplicationUnload');


}






function pageLoad()






{


// Sys.Application.findComponent() - 根据id查找Component


// Sys.Application.findComponent(id, parent) - parent可选


alert($find('Button1').get_id());


}




</script>






<script type="text/javascript">



function listComponents()






{


// getComponents() - 获得所有Component(数组)


var c = Sys.Application.getComponents();




for (var i=0; i<c.length; i++)






{


var id = c[i].get_id();


var type = Object.getTypeName(c[i]);




Sys.Debug.trace('Component:' + i + ': id=' + id + ', type=' + type);


}


}


</script>




<p>


<button type="button" id="Button1">


</button>


<span id="Label1"></span>


</p>


<p>


<input type="button" id="Button2" value="列举所有Component" onclick="listComponents()" />


</p>


<p>


<textarea id="TraceConsole" style="width: 500px; height: 400px;"></textarea>


</p>


</asp:Content>



运行结果

1、页面加载

弹出框,信息:ApplicationLoad

是否是部分刷新:false

最后一次触发load事件时创建的Component:Button1

最后一次触发load事件时创建的Component:Label1

弹出框,信息:Button1

2、鼠标点击、经过和离开“自定义Button(Button1)”或“自定义Button(Label1)”

有相应的提示

3、单击“列举所有Component”按钮

Component:0: id=Button1, type=Demo.CustomButton

Component:1: id=Label1, type=Demo.CustomButton

4、关闭浏览器

弹出框,信息:ApplicationUnload

CultureInfo.aspx(注:设置ScriptManager的EnableScriptGlobalization="True")




<%

@ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="CultureInfo.aspx.cs"


Inherits="ClientScripting_Sys_CultureInfo" Title="CultureInfo" Culture="auto"


UICulture="auto" %>




<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">






<script runat="Server">



protected override void InitializeCulture()






{


string s = Request.QueryString["currentculture"];




if (!String.IsNullOrEmpty(s))






{


System.Threading.Thread.CurrentThread.CurrentUICulture = new System.Globalization.CultureInfo(s);


System.Threading.Thread.CurrentThread.CurrentCulture = System.Globalization.CultureInfo.CreateSpecificCulture(s);


}


}


</script>




<p>


<a href="?currentculture=zh-cn">中文</a>   <a href="?currentculture=en-us">英文</a>


  <a href="?currentculture=sq">阿尔巴尼亚语</a>


</p>


<div>


<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>


<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>


<asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>


<asp:Label ID="Label4" runat="server" Text="Label"></asp:Label>


</div>






<script type="text/javascript">



// 创建一个Sys.CultureInfo对象


var cultureObject = Sys.CultureInfo.CurrentCulture;




// 当前Culture的名称


var cultureName = cultureObject.name;




// 获得dateTimeFormat对象


var dtfObject = cultureObject.dateTimeFormat;




// 创建一个具有各种格式化类型的数组


var myArray =


[


'AMDesignator',


'Calendar',


'DateSeparator',


'FirstDayOfWeek',


'CalendarWeekRule',


'FullDateTimePattern',


'LongDatePattern',


'LongTimePattern',


'MonthDayPattern',


'PMDesignator',


'RFC1123Pattern',


'ShortDatePattern',


'ShortTimePattern',


'SortableDateTimePattern',


'TimeSeparator',


'UniversalSortableDateTimePattern',


'YearMonthPattern',


'AbbreviatedDayNames',


'ShortestDayNames',


'DayNames',


'AbbreviatedMonthNames',


'MonthNames',


'IsReadOnly',


'NativeCalendarName',


'AbbreviatedMonthGenitiveNames',


'MonthGenitiveNames'


];




var result = '区域名称:' + cultureName;




for (var i = 0, l = myArray.length; i < l; i++)






{


var arrayVal = myArray[i];


if (typeof(arrayVal) !== 'undefined')






{


result += "<tr><td>" + arrayVal + "</td><td>" + eval("dtfObject." + arrayVal) + '</td></tr>';


}


}


var resultHeader = "<tr><td><b>格式化类型</b></td><td><b>格式化值</b></td></tr>"


$get('<%= Label1.ClientID %>').innerHTML = "<table border=1>" + resultHeader + result +"</table>";




var d = new Date();


$get('<%= Label2.ClientID %>').innerHTML = "<p/><h3>dateTimeFormat示例:" +


d.localeFormat(Sys.CultureInfo.CurrentCulture.dateTimeFormat.FullDateTimePattern) + "</H3>";








// 获得numberFormat对象


nfObject = cultureObject.numberFormat;




// 创建一个具有各种格式化类型的数组


myArray =


[


'CurrencyDecimalDigits',


'CurrencyDecimalSeparator',


'IsReadOnly',


'CurrencyGroupSizes',


'NumberGroupSizes',


'PercentGroupSizes',


'CurrencyGroupSeparator',


'CurrencySymbol',


'NaNSymbol',


'CurrencyNegativePattern',


'NumberNegativePattern',


'PercentPositivePattern',


'PercentNegativePattern',


'NegativeInfinitySymbol',


'NegativeSign',


'NumberDecimalDigits',


'NumberDecimalSeparator',


'NumberGroupSeparator',


'CurrencyPositivePattern',


'PositiveInfinitySymbol',


'PositiveSign',


'PercentDecimalDigits',


'PercentDecimalSeparator',


'PercentGroupSeparator',


'PercentSymbol',


'PerMilleSymbol',


'NativeDigits',


'DigitSubstitution'


];




result = '区域名称:' + cultureName;


for (var i = 0, l = myArray.length; i < l; i++)






{


var arrayVal = myArray[i];


if (typeof(arrayVal) !== 'undefined')






{


result += "<tr><td>" + arrayVal + "</td><td>" + eval("nfObject." + arrayVal) + '</td></tr>';


}


}


var resultHeader = "<tr><td><b>格式化类型</b></td><td><b>格式化值</b></td></tr>"


$get('<%= Label3.ClientID %>').innerHTML = "<table border=1>" + resultHeader + result + "</table>";




var n = 99.987;


$get('<%= Label4.ClientID %>').innerHTML = "<p/><h3>numberFormat示例:" + n.localeFormat("C") + "<h3>";




</script>




</asp:Content>



运行结果

区域名称:zh-CN
格式化类型格式化值
AMDesignator上午
Calendar[object Object]
DateSeparator-
FirstDayOfWeek0
CalendarWeekRule0
FullDateTimePatternyyyy'年'M'月'd'日' H:mm:ss
LongDatePatternyyyy'年'M'月'd'日'
LongTimePatternH:mm:ss
MonthDayPatternM'月'd'日'
PMDesignator下午
RFC1123Patternddd, dd MMM yyyy HH':'mm':'ss 'GMT'
ShortDatePatternyyyy-M-d
ShortTimePatternH:mm
SortableDateTimePatternyyyy'-'MM'-'dd'T'HH':'mm':'ss
TimeSeparator:
UniversalSortableDateTimePatternyyyy'-'MM'-'dd HH':'mm':'ss'Z'
YearMonthPatternyyyy'年'M'月'
AbbreviatedDayNames日,一,二,三,四,五,六
ShortestDayNames日,一,二,三,四,五,六
DayNames星期日,星期一,星期二,星期三,星期四,星期五,星期六
AbbreviatedMonthNames一月,二月,三月,四月,五月,六月,七月,八月,九月,十月,十一月,十二月,
MonthNames一月,二月,三月,四月,五月,六月,七月,八月,九月,十月,十一月,十二月,
IsReadOnlytrue
NativeCalendarName公历
AbbreviatedMonthGenitiveNames一月,二月,三月,四月,五月,六月,七月,八月,九月,十月,十一月,十二月,
MonthGenitiveNames一月,二月,三月,四月,五月,六月,七月,八月,九月,十月,十一月,十二月,

dateTimeFormat示例:2007年6月22日 8:23:27

区域名称:zh-CN
格式化类型格式化值
CurrencyDecimalDigits2
CurrencyDecimalSeparator.
IsReadOnlytrue
CurrencyGroupSizes3
NumberGroupSizes3
PercentGroupSizes3
CurrencyGroupSeparator,
CurrencySymbol
NaNSymbol非数字
CurrencyNegativePattern2
NumberNegativePattern1
PercentPositivePattern1
PercentNegativePattern1
NegativeInfinitySymbol负无穷大
NegativeSign-
NumberDecimalDigits2
NumberDecimalSeparator.
NumberGroupSeparator,
CurrencyPositivePattern0
PositiveInfinitySymbol正无穷大
PositiveSign+
PercentDecimalDigits2
PercentDecimalSeparator.
PercentGroupSeparator,
PercentSymbol%
PerMilleSymbol
NativeDigits0,1,2,3,4,5,6,7,8,9
DigitSubstitution1

numberFormat示例:¥99.98

StringBuilder.aspx




<%

@ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="StringBuilder.aspx.cs"


Inherits="ClientScripting_Sys_StringBuilder" Title="StringBuilder" %>




<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">


<textarea id="TraceConsole" style="width: 500px; height: 300px;"></textarea>






<script type="text/javascript">



function buildString(title)






{


// 创建一个StringBuilder对象


var sb = new Sys.StringBuilder("aaa");


// toString() - 将StringBuilder对象的内容转换为字符串


Sys.Debug.trace("StringBuilder:" + sb.toString());




// 添加指定字符串到StringBuilder对象的结尾


sb.append("bbb");


Sys.Debug.trace("StringBuilder:" + sb);




// 添加指定字符串到StringBuilder对象的结尾并添加一个换行符


sb.appendLine("ccc");


Sys.Debug.trace("StringBuilder:" + sb);




// 添加一个换行符到StringBuilder对象的结尾


sb.appendLine();


// toString(separator) - 在StringBuilder对象内的每一个元素的结尾处添加指定字符串


// 然后将StringBuilder对象的内容转换为字符串


Sys.Debug.trace("StringBuilder:" + sb.toString('xxx'));




// 清除StringBuilder对象所有内容


sb.clear();


Sys.Debug.trace("StringBuilder:" + sb);




// StringBuilder对象的内容是否为空


var bln = sb.isEmpty();


Sys.Debug.trace("StringBuilder:" + bln);


}




function pageLoad()






{


buildString();


}


</script>




</asp:Content>



运行结果

StringBuilder:aaa

StringBuilder:aaabbb

StringBuilder:aaabbbccc

StringBuilder:aaaxxxbbbxxxccc

xxx

StringBuilder:

StringBuilder:true

OK

[源码下载]
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
相关文章推荐