在本演练中,您将使用 ECMAScript (JavaScript) 以全球化格式显示日、月和其他与日期相关的值。ASP.NET 中的 AJAX 功能基于 ScriptManager 控件中的设置提供客户端全球化支持。将这些全球化设置应用于 Web 应用程序后,可以使用客户端脚本基于区域性值设置 JavaScript Date 或 Number 对象的格式。此操作不需要回发到服务器。
客户端脚本使用的区域性值基于由用户的浏览器设置提供的默认区域性设置。或者,还可以通过在应用程序中使用服务器设置或服务器代码,将其设置为特定的区域性值。
区域性值提供有关特定区域性(区域设置)的信息。区域性值由两个表示语言的字母和两个表示国家或地区的字母组合而成。示例包括 es-MX(西班牙语/墨西哥)、es-CO(西班牙语/哥伦比亚)和 fr-CA(法语/加拿大)。
ASP.NET AJAX Date 扩展通过提供 localeFormat 方法,向 JavaScript Date 对象添加新功能。使用此方法可以基于浏览器的语言设置、服务器设置或服务器代码设置 Date 对象的格式。这些设置会影响服务器的区域性值,服务器然后对此区域性值进行解释,以生成一个客户端对象,并由 Sys.CultureInfo.CurrentCulture 属性公开该对象。此对象用于设置日期格式。
一、基于浏览器设置全球化日期
首先,您将使用浏览器中的语言首选项设置来指定如何设置日期格式。
1、关闭任何打开的 Microsoft Internet Explorer 或默认浏览器的实例,以便所有新实例将使用新的区域设置。
2、打开 Internet Explorer 的一个新实例。
3、在“工具”菜单上,依次单击“Internet 选项”、“常规”选项卡和“语言”。
4、将语言首选项设置为 es-MX(西班牙语/墨西哥)并从列表中移除任何其他区域设置。
5、关闭浏览器。
6、在 Visual Studio 中,创建或打开支持 AJAX 的 ASP.NET 网页,然后切换到“设计”视图。
7、选择 ScriptManager 控件并将其 EnableScriptGlobalization 属性设置为 true。
8、在“工具箱”的“AJAX Extensions”选项卡中,双击 UpdatePanel 控件以将更新面板添加到页上。
9、将 UpdatePanel 控件的 ChildrenAsTriggers 属性设置为 false。
10、将 UpdatePanel 控件的 UpdateMode 属性设置为 Conditional。
11、在 UpdatePanel 控件内单击,然后从“工具箱”中的“标准”选项卡中,将 Button 控件和 Label 控件添加到 UpdatePanel 控件中。
12、确保将按钮的 ID 属性设置为 Button1,并将其 Text 属性指定为“显示日期”。
13、确保将标签的 ID 属性设置为 Label1。
14、切换到“源”视图。
15、在页的底部创建一个 script 元素,并在其中添加下面的客户端脚本:
Sys.UI.DomEvent.addHandler($get("Button1"), "click", formatDate);
function formatDate() {
var d = new Date();
try {
$get('Label1').innerHTML = d.localeFormat("dddd, dd MMMM yyyy HH:mm:ss");
}
catch(e) {
alert("Error:" + e.message);
}
}
此代码将一个 click 处理程序添到名为 Button1 的按钮中。此代码调用 formatDate 函数以创建一个新的 Date 对象,并在名为 Label1 的元素中显示格式化的日期。使用 localeFormat 函数设置日期的格式,该函数是 Date 对象的 Microsoft AJAX Library 扩展的一部分。
16、在网站的 Web.config 文件的 system.web 节中包含下列 globalization 元素:
<globalization culture="auto" />
“auto”设置指定使用浏览器请求中的 ACCEPT-LANGUAGE 标头(它提供用户的语言首选项列表)设置区域性值。
17、保存更改,然后在您已更改语言设置的浏览器中运行网页。
18、单击“显示日期”按钮以查看基于浏览器语言设置的全球化日期值。
下面的示例演示一个包含客户端脚本的完整 ASP.NET 网页,此脚本基于浏览器的语言首选项全球化日期。
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html >
<head runat="server">
<title>Globalization Example</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" EnableScriptGlobalization="true"/>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="False"
UpdateMode="Conditional">
<ContentTemplate>
<asp:Panel ID="Panel1" runat="server" GroupingText="Update Panel">
<asp:Button ID="Button1" runat="server" Text="Display Date" />
<br />
<asp:Label ID="Label1" runat="server"></asp:Label>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
<script type="text/javascript">
Sys.UI.DomEvent.addHandler($get("Button1"), "click", formatDate);
function formatDate() {
var d = new Date();
try {
$get('Label1').innerHTML = d.localeFormat("dddd, dd MMMM yyyy HH:mm:ss");
}
catch(e) {
alert("Error:" + e.message);
}
}
</script>
19、完成后,重置浏览器中的语言设置。
二、基于配置设置全球化日期
如果要在多个页中显示格式化日期,可在网站的配置文件中设置区域性。这些格式设置然后将应用于所有页面中的日期。
1、在应用程序的 Web.config 文件中,对 system.web 节中的 globalization 元素进行以下更改:
<globalization culture="fr-CA" />
无论浏览器语言设置如何指定,此设置都会将区域性值设置为“fr-CA”(法语/加拿大)。
2、保存更改,然后在浏览器中运行网页。
3、单击“显示日期”按钮以查看全球化日期值。
现在,日期格式设置将基于配置文件中的区域性属性,而不是基于浏览器语言首选项。
下面的示例演示一个包含客户端脚本的完整 ASP.NET 网页,此脚本基于配置文件设置全球化日期。
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html >
<head runat="server">
<title>Globalization Example</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" EnableScriptGlobalization="true"/>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="False"
UpdateMode="Conditional">
<ContentTemplate>
<asp:Panel ID="Panel1" runat="server" GroupingText="Update Panel">
<asp:Button ID="Button1" runat="server" Text="Display Date" />
<br />
<asp:Label ID="Label1" runat="server"></asp:Label>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
<script type="text/javascript">
Sys.UI.DomEvent.addHandler($get("Button1"), "click", formatDate);
function formatDate() {
var d = new Date();
try {
$get('Label1').innerHTML = d.localeFormat("dddd, dd MMMM yyyy HH:mm:ss");
}
catch(e) {
alert("Error:" + e.message);
}
}
</script>
三、基于页面设置全球化日期
若要为单个页设置区域性,可以使用 @ Page 指令中的 Culture 属性。@ Page 指令的 Culture 属性优先于配置文件中的设置,也优先于浏览器的语言设置。
1、在您正在处理的页面中修改 @ Page 指令,将区域性值设置为“de-DE”(德语/德国),如下面的示例所示:
<%@ Page Language="C#" AutoEventWireup="true" Culture="de-DE" %>
保存更改,然后在浏览器中运行网页。
2、单击“显示日期”按钮以查看全球化日期值。
3、现在,日期格式设置将基于 @ Page 指令的 Culture 属性。
下面的示例演示一个包含客户端脚本的完整 ASP.NET 网页,此脚本基于页面设置全球化日期。
<%@ Page Language="C#" Culture="de-DE" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html >
<head runat="server">
<title>Globalization Example</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" EnableScriptGlobalization="true"/>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="False"
UpdateMode="Conditional">
<ContentTemplate>
<asp:Panel ID="Panel1" runat="server" GroupingText="Update Panel">
<asp:Button ID="Button1" runat="server" Text="Display Date" />
<br />
<asp:Label ID="Label1" runat="server"></asp:Label>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
<script type="text/javascript">
Sys.UI.DomEvent.addHandler($get("Button1"), "click", formatDate);
function formatDate() {
var d = new Date();
try {
$get('Label1').innerHTML = d.localeFormat("dddd, dd MMMM yyyy HH:mm:ss");
}
catch(e) {
alert("Error:" + e.message);
}
}
</script>
四、通过编程方式全球化日期
如果要通过编程方式设置页面的区域性值,可在服务器代码中重写页面的 InitializeCulture 方法。InitializeCulture 方法优先于 @ Page 指令、配置文件和浏览器中的区域性设置。
1、将以下方法添加到页面中:
protected override void InitializeCulture()
{
this.Culture = "it-IT";
}
此代码重写基 Page 类的 InitializeCulture 方法,并将区域性值设置为“it-IT”(意大利语/意大利)。这是页的生命周期中适合通过编程方式更改区域性的时机。
2、保存更改,然后在浏览器中运行网页。单击“显示日期”按钮以查看全球化日期。现在基于服务器代码格式化日期值。
下面的示例演示一个包含客户端脚本的完整 ASP.NET 网页,此脚本通过编程方式全球化日期。
<%@ Page Language="C#" Culture="de-DE" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<script runat="server">
protected override void InitializeCulture()
{
this.Culture = "it-IT";
}
</script>
<html >
<head runat="server">
<title>Globalization Example</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" EnableScriptGlobalization="true"/>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="False"
UpdateMode="Conditional">
<ContentTemplate>
<asp:Panel ID="Panel1" runat="server" GroupingText="Update Panel">
<asp:Button ID="Button1" runat="server" Text="Display Date" />
<br />
<asp:Label ID="Label1" runat="server"></asp:Label>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
<script type="text/javascript">
Sys.UI.DomEvent.addHandler($get("Button1"), "click", formatDate);
function formatDate() {
var d = new Date();
try {
$get('Label1').innerHTML = d.localeFormat("dddd, dd MMMM yyyy HH:mm:ss");
}
catch(e) {
alert("Error:" +
分享到:
相关推荐
ASP.NET 服务器控件:DropDownCheckBoxList ,支持下拉多选,支持.NET3.5 支持主流浏览器IE8及以上版本 FF3.5+,Chrome 9+,Safari 5 等浏览器。
asp.net-rdlcasp.net-rdlc 报表入门
ASP.NET中使用客户端脚本
ASP.NET-repeater控件使用
第一章:ajax概述 第七章:使用客户端脚本对UpdateProgress编 第二章:使用ScriptManager 第八章:自定义异常处理 第三章:使用ScriptManagerProxy控件 第九章:在母版页中使用UpdatePanel 第四章:使用...
asp.net--班级学生信息管理系统 用asp.net做的 程序绝对完整,简单,很容易看懂,我和同学合作编写,页面设计新颖。
CRUD-.NET-Core:CRUd con el .NET core con ASP .NEt con MVC和C#
ASP.NET 是一个使用 HTML、CSS、JavaScript 和服务器脚本创建网页和网站的开发框架,ASP.NET由专门用于生成web应用程序的工具和库来扩展。NET 平台。. ASP.NET 为 .NET 平台添加了以下内容: 用于处理 C# 或 F# 中 ...
ASP.NET--网上购物商城项目源码,用户名:mr,密码:mrsoft
ASP.NET-API-test:简单测试ASP.NET API
如何在asp.net网站项目中使用APQuery.net。 如何在asp.net MVC项目中使用APQuery.net。 当然会发布一个Admin系统,它将是一个非常完整的版本项目。 “动态视图和动态报告中心”的演示。 因为我维护APQuery.net...
(亲测正确版)ASP.NET-c#-捕捉网页快照-网站截图-网站缩略图 ★★★★★★★★★★★★★★★★★★★...网上流传了很多网站缩略图的asp.net,但是都无法使用,本人亲测,该代码进行优化,速度快,效率高,占内存非常少。
如何在ASP.NET页面中使用一种特定类型的对象,即服务器控件,以及如何充分利用这个控件。
login-ASP.NET-Core-MVC-MySQL:cadastro示例,使用ASP.NET Core MVC实用程序登录MySQL
ASP.NET-Core-with-ADO.NET 一个使用 ADO.NET 的 ASP.NET Core 网站MyUserStore.cs和MyRoleStore.cs演示了IUserStore和IRoleStore的自定义实现。
包括对JavaScript 在面向对象、DOM 操作方面的扩展、ASP.NET AJAX 客户端组件、ASP.NET AJAX XML脚本等,还介绍了ASP.NET AJAX 框架为开发者在客户端用JavaScript 与服务器端通信而创造的种种便利条件,包括直接调用...
资源名字:基于C#+asp.net+FTP的FTP客户端设计与实现(源码+文档)_C#_asp.net_FTP_FTP客户端.zip 资源内容:项目全套源码+完整文档 源码说明: 全部项目源码都是经过测试校正后百分百成功运行。 适合场景:相关项目...
Asp.NET-CORE-MVC-ShopAppUygulamam:.Net 5版本Asp.NET shopapp用户指南
ASP.NET_AJAX入门系列:使用客户端脚本对UpdateProgress编程.doc ASP.NET_AJAX入门系列:在多个UpdatePanle中使用Timer控件.doc ASP.NET_AJAX入门系列:在母版页中使用UpdatePanel.doc ASP.NET_AJAX入门系列:自定义...
在ASP.NET UpdatePanel中的jQuery 在ASP.NET UpdatePanel中使用jQuery 在CodeProject中也有关于此主题的文章。 单击此处: :