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

ASP.NET_Ajax实训练习之创建和使用Ajax组件

2016-06-27 16:53 671 查看

首先，建立新的ASP.NET网站。

本例用于用户登录时检测密码强度：

添加一个javascript文件：创建Ajax组件

<span style="font-size:14px;">//注册一个命名空间
Type.registerNamespace("AjaxEnabled");
//为JavaScript类定义构造函数
AjaxEnabled.PasswordStrengthComponent = function () {
AjaxEnabled.PasswordStrengthComponent.initializeBase(this);
}
//定义类的内部，通过创建它的原型完成。在原型内部，声明一个称为returnPasswordStrength的函数，用来获取一个密码，验证它的值，并且返回它的强度。
AjaxEnabled.PasswordStrengthComponent.prototype = {
initialize: function () {
AjaxEnabled.PasswordStrengthComponent.callBaseMethod(this, 'initialize');
},
returnPasswordStrength: function (password) {
var strPass = new String(password.toString());
if (strPass.length < 5) {
return "Weak";
}
else {
if (strPass.length < 8) {
return "Medium";
}
else { return "Strong";}
}
},
dispose: function () {
AjaxEnabled.PasswordStrengthComponent.callBaseMethod(this, 'dispose');
}
}
//最后在类中添加代码，注册类。同时表明该类继承自Sys.Component
AjaxEnabled.PasswordStrengthComponent.registerClass('AjaxEnabled.PasswordStrengthComponent', Sys.Component);
if (typeof (Sys) !== 'undefined')
Sys.Application.notifyScriptLoaded();//加载
</span>

在web页面调用Ajax组件，新建web窗体

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>

</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Scripts><!--用来管理脚本，引入Ajax文件-->
<asp:ScriptReference Path="~/PasswordStrengthComponent.js" />
</Scripts>
</asp:ScriptManager>
<script language="javascript" type="text/javascript">
function _OnKeypress() {
var checker = new AjaxEnabled.PasswordStrengthComponent();//新建Ajax组件实例
var pass = document.getElementById("TextBoxPassWord").value;//获取页面中名为TextBoxPassWord的控件的值
var strength = checker.returnPasswordStrength(pass);//将该值传递给Ajax组件返回结果
document.getElementById("LabelStrength").innerText = strength;//将结果显示在页面
}
</script>
<div style="font-size:large;font-weight:bold">User Login
</div>
<hr />
<br />
UserName:
<br /><asp:TextBox ID="TextBoxUserName" runat="server" Width="200"></asp:TextBox>
<br />
PassWord:
<br /><asp:TextBox ID="TextBoxPassWord" runat="server" Width="200" TextMode="Password"></asp:TextBox>
<asp:Label ID="LabelStrength" runat="server" Text=""></asp:Label><br />
<input id="Button1" type="button" value="Submit" onclick="_OnKeypress()"/><!--调用script-->
</form>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： asp.net ajax

相关文章推荐

新的分享

章节导航