Ajax的注册应用

最近发现Ajax在用户注册表单和用户登录表单方面应用，最能体现Ajax的交互特点，因此又是写了一个习作！
演示效果

新开窗口地址： http://www.klstudio.com/demo/ajax/reg.htm
下载地址:http://www.klstudio.com/demo/ajax/reg.rar

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>ajax注册应用</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script language="javascript" src="js/common.js"></script>
<script language="javascript" src="js/prototype.js"></script>
<script language="javascript" src="js/passwordstrength.js"></script>
<script language="javascript" src="reg.js"></script>
<style type="text/css">
<!--
body,td,th,div,input {}{
font-family: Courier New, Courier, mono;
font-size: 12px;
}
body {}{
margin: 0px;
}
.FrameDivPass{}{
background-color: #F7F7F7;
border: 1px solid #EEEEEE;
padding: 2px;
height: 100%;
float: left;
}
.FrameDivPass input{}{
background-color: #FFFFFF;
width: 150px;
float: left;
border: 1px solid #6FBE44;
}
.FrameDivPass div{}{
color: #999999;
float: left;
margin-right: 5px;
margin-left: 10px;
height: auto;
width: auto;
display: block;
}
.FrameDivWarn{}{
background-color: #FFFBE7;
border: 1px solid #B5B5B5;
padding: 2px;
height: 100%;
float: left;
}
.FrameDivWarn input{}{
background-color: #FFFFFF;
width: 150px;
float: left;
border: 1px solid #FF0000;
}
.FrameDivWarn div{}{
color: #333333;
float: left;
margin-right: 5px;
margin-left: 10px;
height: auto;
width: auto;
display: block;
}
.FrameDivNormal{}{
border: 1px solid #FFFFFF;
padding: 2px;
height: 100%;
float: left;
background-color: #FFFFFF;
}
.FrameDivNormal input{}{
background-color: #FFFFFF;
width: 150px;
float: left;
border: 1px solid #999999;
}
.FrameDivNormal div{}{
color: #333333;
float: left;
margin-right: 5px;
margin-left: 10px;
height: auto;
width: auto;
display: block;
}
#checkBtn{}{
float: left;
}
#checkDiv{}{
color: #333333;
float: left;
margin-right: 5px;
margin-left: 10px;
height: auto;
width: auto;
display: block;
}
-->
</style>
<script language="javascript">
var icon = '<img src="images/warning.gif" width="14" height="14" border="0" align="absmiddle">';
var ns = ["usr","pwd","repwd","eml"];
function changeUsr(){
if($("checkBtn").disabled) $("checkBtn").disabled = false; 
}
function checkUsr(s){ 
var ma = ["用户名（3-16位）！","用户名由数字、英文、下划线、中杠线组成！"];
if(!limitLen(s,3,16)){
showInfo("usr",ma[0]);
return false;
}
if(!hasAccountChar(s)){
showInfo("usr",ma[1]);
return false;
}
showInfo("usr");
return true;
}
function checkPwd(s){
var ma = ["密码（5-16位）！","密码不能包含中文或全角符号！","两次输入的密码不一致！"];
ps.update(s);
if(!limitLen(s,5,16)){
showInfo("pwd",ma[0]);
return false;
}
if(hasChineseChar(s)){
showInfo("pwd",ma[1]);
return false;
}
if(limitLen($F("repwdInput"),5,16)){
if(trim($F("repwdInput")) == trim(s)){
showInfo("pwd");
showInfo("repwd");
return true;
}else{
showInfo("pwd",ma[2]);
return false;
}
}
showInfo("pwd");
return true;
}
function checkPwd2(s){
var ma = ["确认密码（5-16位）！","密码不能包含中文或全角符号！","两次输入的密码不一致！"];
if(!limitLen(s,5,16)){
showInfo("repwd",ma[0]);
return false;
}
if(hasChineseChar(s)){
showInfo("repwd",ma[1]);
return false;
}
if(limitLen($F("pwdInput"),5,16)){
if(trim($F("pwdInput")) == trim(s)){
showInfo("pwd");
showInfo("repwd");
return true;
}else{
showInfo("repwd",ma[2]);
return false;
}
}
showInfo("repwd");
return true;
}
function checkEml(s){
var ma = ["请输入常用邮件！","邮件格式不正确！"];
if(s.length < 5){
showInfo("eml",ma[0]);
return false;
}
if(!isEmail(s)){
showInfo("eml",ma[1]);
return false;
}
showInfo("eml");
return true;
}
function showInfo(n,s){
var fdo = $(n+"FrameDiv");
var ido = $(n+"InfoDiv");
if(typeof s == 'undefined'){
fdo.className = "FrameDivPass";
ido.innerHTML = "填写正确！";
}else{
fdo.className = "FrameDivWarn";
ido.innerHTML = icon + s;
}
}
//======================================================;
function loadCheck(){
if(trim($F('usrInput')).length == 0) return;
$("checkBtn").disabled = true;
var o = $("checkDiv");
o.innerHTML = getLoadInfo(); 
loadAjaxData("reg.asp",{usr:$F('usrInput')},successCheck,errorCheck);
}
function successCheck(v){
var o = $("checkDiv");
o.innerHTML = getCheckHTML(v.responseText);
}
function errorCheck(){
$("checkBtn").disabled = false;
var o = $("checkDiv");
o.innerHTML = getErrorInfo();
}
function getCheckHTML(s){
s = (s == "1")? "恭喜您，用户名可以注册！":"对不起，该用户名已经被注册！";
return s;
}
//======================================================;
function getLoadInfo(){
return '<img src="images/loading.gif" width="16" height="16" border="0" align="absmiddle">正在加载数据';
}
function getErrorInfo(){
return '<img src="images/warning.gif" width="14" height="14" border="0" align="absmiddle">数据加载失败!';
}
//======================================================;
function initPage(){
for(var i=0;i<ns.length;i++){
$(ns[i]+"Input").value = "";
}
}
</script>
</head> 


<body onLoad="initPage();">
<table width="100%" border="0" cellpadding="5" cellspacing="1" bgcolor="#CCCCCC">
<tr>
<th width="20%" bgcolor="#EEEEEE" scope="row">用户名</th>
<td bgcolor="#FFFFFF"><div class="FrameDivNormal" id="usrFrameDiv"><input name="usrInput" type="text" id="usrInput" maxlength="16" onKeyUp="checkUsr(this.value);changeUsr();" onFocus="checkUsr(this.value);">
<div id="usrInfoDiv"></div>
</div></td>
</tr>
<tr>
<th bgcolor="#EEEEEE" scope="row">&nbsp;</th>
<td bgcolor="#FFFFFF" ><input name="checkBtn" type="button" id="checkBtn" onClick="loadCheck();" value="检测用户名是否可用"> <div id="checkDiv"></div></td>
</tr>
<tr>
<th bgcolor="#EEEEEE" scope="row">密码强度</th>
<td bgcolor="#FFFFFF">
<script language="javascript">
var ps = new PasswordStrength();
ps.setSize("200","22");
</script>
</td>
</tr>
<tr>
<th bgcolor="#EEEEEE" scope="row">密码</th>
<td bgcolor="#FFFFFF"><div class="FrameDivNormal" id="pwdFrameDiv"><input name="pwdInput" type="password" id="pwdInput" maxlength="16" onKeyUp="checkPwd(this.value);" onFocus="checkPwd(this.value);">
<div id="pwdInfoDiv"></div>
</div></td>
</tr>
<tr>
<th bgcolor="#EEEEEE" scope="row">确认密码</th>
<td bgcolor="#FFFFFF"><div class="FrameDivNormal" id="repwdFrameDiv"><input name="repwdInput" type="password" id="repwdInput" maxlength="16" onKeyUp="checkPwd2(this.value);" onFocus="checkPwd2(this.value);">
<div id="repwdInfoDiv"></div>
</div></td>
</tr>
<tr>
<th bgcolor="#EEEEEE" scope="row">EMail</th>
<td bgcolor="#FFFFFF"><div class="FrameDivNormal" id="emlFrameDiv"><input name="emlInput" type="text" id="emlInput" onFocus="checkEml(this.value);" onKeyUp="checkEml(this.value);" maxlength="40">
<div id="emlInfoDiv"></div>
</div></td>
</tr>
<tr>
<th bgcolor="#EEEEEE" scope="row">&nbsp;</th>
<td bgcolor="#FFFFFF"><input type="submit" name="Submit" value="提交"></td>
</tr>
</table>
</body>
</html>

转载于:https://www.cnblogs.com/vmusicworm/archive/2008/06/06/1215069.html

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/380018.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

XADD和NEG命令

XADD和NEG命令

XADD 交换相加指令&#xff0c;先交换然后相加 比如说&#xff1a; xadd eax&#xff0c;ecx /* 相当于&#xff1a;先执行&#xff1a;xchg eax,ecx然后执行&#xff1a;add eax,ecx */此时eax2&#xff0c;ecx3&#xff0c;执行完&#xff1a;eax5&#xff0c;ecx2 neg …
阅读更多...
Java——File类

Java——File类

一&#xff0c;File类的概述和构造方法 A&#xff1a;file类的概述 file类可以理解成一个路径 文件夹或者是文件夹路径 路径分为绝对路径和相对路径 绝对路径是一个固定的路径&#xff0c;从盘符开始 这里的G&#xff1a;\TIM 就是一个绝对路径&#xff0c;是一个固定的路…
阅读更多...
vue3 配置 @符号

vue3 配置 @符号

config,ts 配置 有 爆红 安装 npm install 一下 然后 配置 路径提示功能 tsconfig.json 配置 路径提示功能 一共这两个路径配置
阅读更多...
mts模式_MTS的完整形式是什么？

mts模式_MTS的完整形式是什么？

mts模式MTS&#xff1a;Microsoft Transaction Server /移动电话服务/多通道电视声音 (MTS: Microsoft Transaction Server/ Mobile Telephone Service/ Multichannel Television Sound) 1)MTS&#xff1a;Microsoft Transaction Server (1) MTS: Microsoft Transaction Server…
阅读更多...
Java——IO流

Java——IO流

一&#xff0c;IO流常识 Ⅰ&#xff0c;IO流的概述 1&#xff0c;IO流用来处理设备之间的数据传输 2&#xff0c;Java对数据的操作都是通过流的方式 3&#xff0c;Java用于操作流的类都在IO包中 4&#xff0c;流 按流向分为&#xff1a; ①输入流 ②输出流 5&#xff0…
阅读更多...
《软件》2011年第6期刊登出 《DB 查询分析器》中断SQL语句的执行

《软件》2011年第6期刊登出 《DB 查询分析器》中断SQL语句的执行

《软件》编辑部寄来了2011年第6期样刊&#xff0c;在2011年第6期&#xff0c;刊登出了本人的论文------“《DB 查询分析器》中断SQL语句的执行”。 论文刊登在第42页&#xff0c;排在第13篇&#xff0c;还比较靠前&#xff0c;呵呵。 在“万方数据”和“中国期刊全文数据库”中…
阅读更多...
ret2libc过地址随机化

ret2libc过地址随机化

程序&#xff1a; #include<stdio.h> char buf2[10] "this is buf2"; void vul() {char buf1[10];gets(buf1); } void main() {write(1,"sinxx",5);vul(); }很明显&#xff0c;gets函数存在溢出 编译&#xff1a; gcc -no-pie -fno-stack-protect…
阅读更多...
远控免杀专题(29)-C#加载shellcode免杀-5种方式(VT免杀率8-70)

远控免杀专题(29)-C#加载shellcode免杀-5种方式(VT免杀率8-70)

0x00 免杀能力一览表 几点说明&#xff1a; 1、表中标识 √ 说明相应杀毒软件未检测出病毒&#xff0c;也就是代表了Bypass。 2、为了更好的对比效果&#xff0c;大部分测试payload均使用msf的windows/meterperter/reverse_tcp模块生成。 3、由于本机测试时只是安装了360全家…
阅读更多...
WPF界面设计技巧（2）—自定义漂亮的按钮样式

WPF界面设计技巧（2）—自定义漂亮的按钮样式

上次做了个很酷的不规则窗体&#xff0c;这次我们来弄点好看的按钮出来&#xff0c;此次将采用纯代码来设计按钮样式&#xff0c;不需要 Microsoft Expression Design 辅助了。 首先打开 Microsoft Visual Studio 2008 &#xff0c;新建一个WPF项目&#xff0c;在上面随便放几个…
阅读更多...
ropgadgets与ret2syscall技术原理

ropgadgets与ret2syscall技术原理

程序&#xff1a; #include <stdio.h> #include <string.h> #include <sys/types.h> #include <unistd.h> #include <sys/syscall.h> void exploit() { system("/bin/sh"); } void func() { char str[0x20]; read(0,str,0x50); } int…
阅读更多...
PHP中单引号和双引号的区别

PHP中单引号和双引号的区别

0x01 单引号 单引号里面的内容不会被解释&#xff0c;不管什么内容&#xff0c;都当做字符串处理 <?php$abc1234; $stradc$abc; echo $str;输出 0x02 双引号 双引号里面的内容会被解释&#xff0c;像一些换行&#xff08;\n)、数据元素等都会被解释 <?php$abc1234;…
阅读更多...
关闭页面时执行“退出”的解决方案

关闭页面时执行“退出”的解决方案

在有些应用中我们需要实时的更新站点用户是否在线的状态。比如一些论坛里的在线成员实时显示&#xff0c;或基于网页的聊天、会议系统等。这种情况下&#xff0c;如果用户点击“退出”按钮或链接&#xff0c;我们将之行一系列后台操作&#xff0c;将该用户标识成off line状态&a…
阅读更多...
python网络编程---TCP客户端

python网络编程---TCP客户端

0x01 环境 python2、 pycharm 0x02 程序 # -*- coding:UTF-8 -*- import sockettarget_hostwww.baidu.com tarfet_port80target_hostlocalhost target_port3345 dataABCDEF# 创建一个socket对象 client socket.socket(socket.AF_INET,socket.SOCK_STREAM) # 连接客户端 clien…
阅读更多...
python网络编程---TCP服务器

python网络编程---TCP服务器

0x01 环境 python2 pycharm 0x02 程序 客户端程序&#xff1a; # -*- coding:UTF-8 -*- import sockettarget_hostwww.baidu.com target_port80target_hostlocalhost target_port3345 dataABCDEF# 创建一个socket对象 client socket.socket(socket.AF_INET,socket.SOCK_STRE…
阅读更多...
sys.argv和getopt

sys.argv和getopt

0x01 sys.argv sys.argv用来读取命令行参数&#xff0c;保存程序的文件名和命令参数&#xff0c;读入的参数以列表保存 import sysprint sys.argv print type(sys.argv)可以看到&#xff0c;sys.argv把空格当成分隔符&#xff0c;空格两边的值当做sys.argv的一个元素&#xf…
阅读更多...
[导入]《大话设计模式》重印公告

[导入]《大话设计模式》重印公告

摘要: 《大话设计模式》12月中旬上市&#xff0c;至2008年1月底仅仅一个多月&#xff0c;5000册即销售一空&#xff0c;清华大学出版社已经开始重印&#xff0c;也就是说很快可以在二月底或三月初看到新印刷修正过大部分错误的《大话设计模式》。 阅读全文[新闻]《人民日报市场…
阅读更多...
hdu1053 Entropy hdu2527 Safe Or Unsafe

hdu1053 Entropy hdu2527 Safe Or Unsafe

裸裸的哈弗曼编码&#xff0c;求出哈弗曼编码的路径长度&#xff0c;注意整个字符串为一种字符的情况 View Code #include<iostream>#include<queue>#include<algorithm>#include<vector>using namespace std;struct node{int u,w; node(int a0,in…
阅读更多...
sys.stdin.read和raw_input函数

sys.stdin.read和raw_input函数

sys.stdin.read函数 例子&#xff1a; import sysreadsys.stdin.read() for i in range(len(read)):print i,read[i],-1运行&#xff0c;当执行到readsys.stdin.read()会阻塞&#xff0c;等待我们输入 我们输入&#xff1a; h e当输入&#xff0c;ctrlD结束输入&#xff0c…
阅读更多...
利用带关联子查询Update语句更新数据

利用带关联子查询Update语句更新数据

Update是T-sql中再简单不过的语句了&#xff0c;update table set columnexpression [where condition]&#xff0c;我们都会用到。但update的用法不仅于此&#xff0c;真正在开发的时候&#xff0c;灵活恰当地使用update可以达到事半功倍的效果。 假定有表Table1&#xff08;…
阅读更多...
web安全----XSS漏洞之基本原理

web安全----XSS漏洞之基本原理

0x01 概述 XSS为跨站脚本攻击&#xff0c;XSS攻击针对的是用户层面的攻击&#xff01;类型有反射型XSS、存储型XSS、DOM型XSS&#xff0c;这里的DOM可以理解为页面&#xff0c;或者是所有的标签、内容之和 0x02 反射型XSS 反射型XSS攻击流程为&#xff1a; 即&#xff1a; …
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023