ASP.NET Ajax表单验证-HTML代码

最新推荐文章于 2021-08-06 12:08:09 发布
最新推荐文章于 2021-08-06 12:08:09 发布
阅读量1.2k 收藏
点赞数
分类专栏： # c# 文章标签： asp.net ajax server stylesheet button input
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/fly_to_the_winds/article/details/3987576
版权
.aspx中HTML代码:
<%@ Page language="c#" Codebehind="biaodanyan.aspx.cs" AutoEventWireup="false" Inherits="ajaxselect.biaodanyan" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>Ajax验证表单</title>
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="JavaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
<link href="StyleSheet1.css" rel="stylesheet">
 <script type="text/ecmascript">
/********************************************************************************* 函数名称：resultRemain?* 功能说明：根据传递值，改变表单提示状态 * 参??? 数：id:表单span ID号；str:提示文字；CssClassName:改变提示颜色的CSS Style Class名称*********************************************************************************/
function resultRemain(id,stype,str,CssClassName) {
switch (stype) {
//默认
case "normal" : eval("span_"+id).className=CssClassName; break;
//正确
case "right" : eval("span_"+id).innerHTML=str; eval("error_"+id).innerHTML=""; eval("span_"+id).className=CssClassName; break;
//错误
case "error": eval("span_"+id).className=CssClassName; eval("error_"+id).innerHTML=str; eval("span_"+id).innerHTML=""; break;
//获得焦点
case "focus": eval("span_"+id).innerHTML=str; eval("span_"+id).className=CssClassName; default : break; } }
/******************************************************************************** * 函数名称：onFocusForm * 功能说明：密码输入框获得焦点时显示提示状态 * 参 数：o:表单对象 * 调用方式：表单控件名称.Attributes["onblur"] = "return onFocusForm(this);"; //(Asp.net) *********************************************************************************/
function onFocusForm(o,str) {
if(o){ resultRemain(o.id,"focus",str,"srchtab01"); } }
/******************************************************************************** * 函数名称：onCheckPwd * 功能说明：当表单失去焦点时，触发相应的密码检测 * 参 数：o:表单对象 * 调用方式：表单名称.Attributes["onblur"] = "return onCheckPwd(this);"; //(Asp.net) *********************************************************************************/
function onCheckPwd(o){
var p = o.value;
if(p){ //测试密码长度,包括汉字密码
var len = 0;
var ary = escape(p).match(/(%u[0123456789ABCDEF]{4})+/g);
if(ary){
len = unescape(ary.join("")).length * 2;
p = unescape(escape(str).replace(/(%u[0123456789ABCDEF]{4})+/g,""));
len += p.length; }else{ len = p.length; }
if(len < 6 || len > 20){
resultRemain(o.id,"error"," 密码有误 ","srchtab01");
return false; }else{ resultRemain(o.id,"right","填写正确 ","formnormal");
return true; } }else{ resultRemain(o.id,"error"," 密码不能为空 ","srchtab01");
return false; } }
/******************************************************************************** * 函数名称：onComparePwd * 功能说明：当表单失去焦点时，检测确认密码是否与密码相同 * 参数：o:表单对象 * 调用方式：表单名称.Attributes["onblur"] = "return onComparePwd(this1,this2);"; //(Asp.net) *********************************************************************************/
function onComparePwd(o1,o2){
var p = o1.value;
var q = o2.value;
if(p){ if(q!=p){ resultRemain(o1.id,"error"," 确认密码有误 ","srchtab01");
return false; }
else{
resultRemain(o1.id,"right","填写正确 ","formnormal");
return true; } }
else{ resultRemain(o1.id,"error"," 密码不能为空 ","srchtab01");
return false; } }
/********************************************************************************** * 函数名称：strlen * 功能说明：检测字符串长度 * 参数：o:表单对象;len:字符串长度 * 调用方式：表单名称.Attributes["onblur"] = "return strlen(this,30);"; //(Asp.net) ***********************************************************************************/
function strlen(o,len) {
var p = o.value;
if(p) {
var l=p.length; i
f(l>len) {
resultRemain(o.id,"error"," 字符超过长度 ","srchtab01");
return false; }
else resultRemain(o.id,"right","填写正确 ","formnormal");
return true; }
else { resultRemain(o.id,"error"," 资料不能为空 ","srchtab01");
return false; } }
/********************************************************************************** * 函数名称：onCheckPostCode(o) * 功能说明：检测邮编是否合法 * 参数：o:表单对象; * 调用方式：表单名称.Attributes["onblur"] = "return onCheckPostCode(this);"; //(Asp.net) ***********************************************************************************/
function onCheckPostCode(o){
var str = o.value;
if(str){ var pattern = /^/d{6}$/;
if(!pattern.test(str)) {
resultRemain(o.id,"error"," 邮编输入不合法 ","srchtab01");
return false; }
else{ resultRemain(o.id,"right","填写正确 ","formnormal");
return true; } }else{ resultRemain(o.id,"error"," 邮编不能为空 ","srchtab01");
return false; } }
/********************************************************************************** * 函数名称：onCheckTel(o) * 功能说明：检测电话号码是否合法或传真 * 参 数：o:表单对象; * 调用方式：表单名称.Attributes["onblur"] = "return onCheckPostCode(this);"; //(Asp.net) ***********************************************************************************/
function onCheckTel(o){
var str = o.value;
if(str){ var pattern = /^((/d{3,4}-?/d{7,8})|(/d{7,8}))$/;
if(!pattern.test(str)) {
resultRemain(o.id,"error"," 号码格式不合法 ","srchtab01");
return false; }
else{ resultRemain(o.id,"right","填写正确 ","formnormal");
return true; } }
else{ resultRemain(o.id,"error"," 号码不能为空 ","srchtab01");
return false; } }
/********************************************************************************** * 函数名称：onCheckMobile(o) * 功能说明：检测手机号码是否合法 * 参数：o:表单对象; * 调用方式：表单名称.Attributes["onblur"] = "return onCheckMobile(this);"; //(Asp.net) ***********************************************************************************/
function onCheckMobile(o){
var str = o.value;
if(str){ var pattern = /^(0?13/d{9})$/;
if(!pattern.test(str)) {
resultRemain(o.id,"error"," 手机号码输入不合法 ","srchtab01");
return false; }
else{
resultRemain(o.id,"right","填写正确 ","formnormal");
return true; } }else{ resultRemain(o.id,"error"," 手机号码不能为空 ","srchtab01");
return false; } }
/********************************************************************************** * 函数名称：onCheckEmail(o) * 功能说明：检测E-mail是否合法 * 参数：o:表单对象; * 调用方式：表单名称.Attributes["onblur"] = "return onCheckEmail(this);"; //(Asp.net) ***********************************************************************************/
function onCheckEmail(o){
var em = o.value;
if(em){
var pattern = /^(/w|_|/.)+@((/w|_|/-)+/.)+(/w){2,3}$/;
if(!pattern.test(em)) {
resultRemain(o.id,"error"," E-mail输入不合法 ","srchtab01");
return false; }
else
{ resultRemain(o.id,"right","填写正确 ","formnormal");
return true; } }
else{ resultRemain(o.id,"error"," E-mail不能为空 ","srchtab01");
return false; } }
/********************************************************************************** * 函数名称：ipcheck(o) * 功能说明：检测IP地址是否合法 * 参数：o:表单对象; * 调用方式：表单名称.Attributes["onblur"] = "return ipcheck(this);"; //(Asp.net) ***********************************************************************************/
function ipcheck(o){
var ipstr=o.value;
if(ipstr){ var reg = /^((/d{1,3})(/./d{1,3}){3})$/;
if(reg.test(ipstr)) {
var ary = ipstr.split('.');
for(key in ary) {
f(parseInt(ary[key]) > 255) {
resultRemain(o.id,"error"," IP输入不合法 ","srchtab01");
return false; } }
resultRemain(o.id,"right","填写正确 ","formnormal");
return true; } else { resultRemain(o.id,"error"," IP输入不合法 ","srchtab01"); return false; } }
else {
resultRemain(o.id,"error"," IP不能为空 ","srchtab01");
return false; } }
/********************************************************************************** * 函数名称：checkNum(o) * 功能说明：检测是否为纯数字 * 参数：o:表单对象; * 调用方式：表单名称.Attributes["onblur"] = "return checkNum(this);"; //(Asp.net) ***********************************************************************************/
function checkNum(o) {
var str=o.value;
if(str) {
var reg =//D/;
if(!reg.test(str)) { resultRemain(o.id,"right","填写正确 ","formnormal");
return true; }
else
{ resultRemain(o.id,"error"," 起始标识应为纯数字! ","srchtab01");
return false; } }
else
{ resultRemain(o.id,"error"," 起始标识不能为空 ","srchtab01");
return false; } }
/********************************************************************************** * 函数名称：checkchinese(o) * 功能说明：检测是否为中文字符 * 参数：o:表单对象; * 调用方式：表单名称.Attributes["onblur"] = "return checkchinese(this);"; //(Asp.net) ***********************************************************************************/
function checkchinese(o) {
var str=o.value; if(str) {
var reg =/[/u0391-/uFFE5]/gi; if(!reg.test(str)) {
resultRemain(o.id,"right","填写正确 ","formnormal");
return true; }
else
{ resultRemain(o.id,"error"," 含有中文字符! ","srchtab01");
return false; } }
else { resultRemain(o.id,"error"," 不能为空 ","srchtab01");
return false; } }
/********************************************************************************** * 函数名称： CheckUid(o) * 功能说明：检测用户名是否合法,暂没做ajax检测 * 参 数：o:表单对象; * 调用方式：表单名称.Attributes["onblur"] = "return CheckUid(this);"; //(Asp.net) ***********************************************************************************/
function CheckUid(o){
var u = o.value;
if(u){
if(u.length < 4 || u.length > 20) {
resultRemain(o.id,"error"," 用户名长度需在4-20之间! ","srchtab01");
 return false; } }
else{ resultRemain(o.id,"error"," 用户名不能为空! ","srchtab01");
return false; }
var pattern = /^([a-zA-Z0-9]|[/u4E00-/uFA2D])+$/;
if(!pattern.test(u)) { resultRemain(o.id,"error"," 用户名包含非法字符! ","srchtab01");
return false; }
else
{ resultRemain(o.id,"right","填写正确 ","formnormal");
return true; }
// if(u == o1.value && u != ""){
// RegStyle(o.id,"right","此用户名可以使用");
// return false;
// }
// var flag = LoadXml(HostName + "/CallPage/Query.aspx?op=QueryUid&s=" + o.value);
// if(flag == 'False'){
// RegStyle(o.id,"right","此用户名可以使用");
// o1.value = u;
// }else{
// RegStyle(o.id,"error","这个用户名已被注册");
// return false;
// } } function RegForm() { var falsestr="";
//检测密码 if(!onCheckPwd(Form1.tb_u_password)) falsestr ="false"; if(!onCheckPwd(Form1.tb_u_password2)) falsestr ="false"; if(!onCheckEmail(Form1.tb_email)) falsestr ="false"; if(!onCheckTel(Form1.tb_tel)) falsestr ="false";
// if(!onCheckMobile(Form1.tb_mobile))
//falsestr +="false|"; if(!CheckUid(Form1.tb_name)) falsestr ="false";
//当falsestr中,包含false中,则返回false if(falsestr=="false") { alert('表单中，有不符合规定的字符'); return false; } else { return true; } }
</script>
 </HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server" οnsubmit="return RegForm();">
<table cellSpacing="1" cellPadding="0" width="770" align="center" border="0">
<tr>
<td style="HEIGHT: 23px"><FONT face="宋体"> 用户名：</FONT></td>
<TD style="HEIGHT: 23px"><INPUT id="tb_name" type="text" runat="server" NAME="tb_name"></td>
<td><span id="span_tb_name" runat="server"></span><pan id="error_tb_name" runat="server"></span></td>
</tr>
<tr>
<td width=30%><FONT face="宋体">密码：</FONT></TD>
<td width=40%><INPUT id="tb_u_password" type="password" runat="server" NAME="tb_u_password"></td>
<td width=30%><span id="span_tb_u_password" runat="server"></span><span id="error_tb_u_password" runat="server"></span></td>
</tr>
<tr>
<td width=30%><FONT face="宋体">确认密码 :</FONT></td>
<td width=40%><INPUT id="tb_u_password2" type="password" runat="server"></td>
<td width=30%><span id="span_tb_u_password2" runat="server"></span><span id="error_tb_u_password2" runat="server"></span></td>
</tr>
<tr>
<TD width=30%><FONT face="宋体">e_Mail ：</font></td>
<tdwidth=40%><INPUT id="tb_email" type="text" runat="server" NAME="tb_email"></td>
<td width=30%><span id="span_tb_email" runat="server"></span><span id="error_tb_email" runat="server"></span></td>
</tr>
<tr>
<TD width=30%> <FONT face="宋体">联系电话：</font></td>
<td width=40%><INPUT id="tb_tel" type="text" runat="server" NAME="tb_tel"></td>
<td wid<th=30%><span id="span_tb_tel" runat="server"></span><span id="error_tb_tel" runat="server"></span></td>
</tr>
</table>
<asp:Button id="Button1" style="Z-INDEX: 101; LEFT: 184px; POSITION: absolute; TOP: 176px" runat="server" Text="注册"></asp:button>
<asp:Button id="Button2" style="Z-INDEX: 102; LEFT: 280px; POSITION: absolute; TOP: 176px" runat="server" Text="取消"></asp:button>
</form>
</body>
</html>
浮生若梦丶
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
ASP.NET --- MVC中的Ajax
じ☆ve暧メ晴的博客
05-30 307
AJAX简介 什么是Ajax Asynchronous JavaScript and XML (JavaScript执行异步网络请求) 如果仔细观察一个Form的提交，你就会发现，一旦用户点击“Submit”按钮，表单开始提交，浏览器就会刷新页面，然后在新页面里告诉你操作是成功了还是失败了。如果不幸由于网络太慢或者其他原因，就会得到一个404页面。 这就是Web的运作原理：一次HTTP请求对应一个页面。 如果要让用户留在当前页面中，同时发出新的HTTP请求，就必须用JavaScript发送这个新请
asp.net中JavaScript数据验证实现代码
10-29
我对JavaScript一直不了解。常常为了一点点的数据验证和无刷新就去动用AJAX，实在不爽——有点杀鸡用牛刀的感觉。
asp.net ajax 类,asp.net ajax 简单实例
weixin_42165973的博客
08-05 293
实例需求：利用Ajax技术实现一个页面不刷新的，并且验证一个用户名是否被注册过的过程。要求：在页面中添加一个文本框标签用于输入用户名，添加一个按钮用于提交用户数据。验证的结果被直接打印在页面上。操作步骤如下：1)打开Visual Studio(笔者使用的是Visual Studio2008 Beta2，因为VS2008在页面的布局方面更好控制)，建立一个网站，如图2-5所示。图2-5新建立一个网站...
ASP.NET Ajax表单验证-.aspx.cs代码
aimcode
03-13 1151
using System;using System.Collections;using System.ComponentModel;using System.Data;using System.Drawing;using System.Web;using System.Web.SessionState;using System.Web.UI;using System.Web.UI.WebContr
mvc ajax表单验证,具有jQuery验证的ASP.Net MVC Ajax表单
weixin_28684449的博客
08-05 126
我有一个MVC视图，其中包含使用Ajax.BeginForm()帮助器方法构建的表单，并且正在尝试使用jQueryValidation插件来验证用户输入。我得到了该插件，以突出显示输入数据无效的输入，但是尽管输入无效，但表单仍被发布到服务器。如何停止此操作，并确保仅在表单验证后才发布数据？我的密码表格：leave a message{UpdateTargetId = "GBPostList",In...
asp.net ajax提交表单数据 及radio取值
yehaifanxing的专栏
12-08 3404
asp.net ajax提交表单数据 webforms mvc模式前后台写法，input radio类型获得值
asp.net -html,ASP.NET简介
weixin_42261886的博客
06-30 174
ASP.NET是一个Web开发平台，它提供了一个编程模型，一个全面的软件基础设施以及为PC和移动设备构建健壮的Web应用程序所需的各种服务。ASP.NET在HTTP协议之上工作，并使用HTTP命令和策略来设置浏览器到服务器的双向通信和协作。ASP.NET是Microsoft .Net平台的一部分。ASP.NET应用程序是编译代码，使用.Net框架中存在的可扩展和可重用组件或对象编写。这些代码可以在...
asp.net 用户注册怎么判断用户名是否重复 ajax,AJAX_asp.net结合Ajax验证用户名是否存在的代码，1， 使用JavaScript js文件，验证 - phpStudy...
weixin_39608478的博客
08-06 341
asp.net结合Ajax验证用户名是否存在的代码1， 使用JavaScript js文件，验证用户名是否存在复制代码 代码如下:var ajax = function(option){var request;var createRequest = function(){//var request;if (window.XMLHttpRequest){request = new XMLHttpRe...
ASP.NET MVC中Ajax
dust__的博客
05-25 1323
一、AJAX简介 什么是Ajax Asynchronous JavaScript and XML (JavaScript执行异步网络请求) 如果仔细观察一个Form的提交，你就会发现，一旦用户点击“Submit”按钮，表单开始提交，浏览器就会刷新页面，然后在新页面里告诉你操作是成功了还是失败了。如果不幸由于网络太慢或者其他原因，就会得到一个404页面。 这就是Web的运作原理：一次HTTP请求对应一个页面。 如果要让用户留在当前页面中，同时发出新的HTTP请求，就必须用JavaScript发送这个新请求，接
net ajax表单,c#-在Asp.net Core中提交ajax表单后,RedirectToAction
weixin_42299775的博客
08-06 336
我有一个名为Index的视图和一个名为“ _Addbook”的PartialView,该视图显示为引导模式.在partialView中,使用ajax格式将数据插入数据库.索引视图：data-target="#modal-book">Add BookPartialview：@model WebApplication1.Models.Bookdata-ajax="true" data-ajax-...
jQuery formValidator表单验证插件ASP.NET示例
03-16
内容索引:.NET源码,Ajax相关,formValidator　jQuery formValidator是一款不错的表单验证插件，ASP/PHP/平台都可以方便的使用，本实例就是在 环境下的使用formValidator的一个功能演示程序，这其中包含各种表单数据...
Ajax表单验证插件ASP.NET示例
07-22
jQuery formValidator是一款不错的表单验证插件，ASP/PHP/ASP.NET平台都可以方便的使用，本实例就是在 ASP.NET环境下的使用formValidator的一个功能演示程序，这其中包含各种表单数据形式的判断，日期选择等。
基于ASP.NET Ajax框架实现表单验证编程原理
12-09
基于ASP.NET Ajax框架实现表单验证编程原理
基于Ajax表单提交及后台处理简单的应用
12-09
首先先说下表单提交吧，要提交表单那么就得先收集表单数据（至于验证这个我就不说了，要说留下下次吧）,有了jquery取个html的值还是简单$(“xxid”).val()等就完了，但如果一张表单收集的数据很多，像这样的表单又有...
asp.net 生成静态分页html
aimcode
12-09 4936
前台就几个输入框，内容输入框用的是FreeTextBox框： http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml" >    添加文章并生成静态HTML页面    var timerID = null; var timerRunning = false; f
ASP.NET Ajax用户名注册验证
aimcode
03-13 3148
//script处理函数                function send_request(flag)          {              //创建XMLHttpRequest;              http_request = false;              if(window.XMLHttpRequest)         
asp.net 获取项目(网站)的物理、虚拟路径的方法
aimcode
12-10 3036
-----------------------------.cs类文件中当前项目的物理路径嘛：         strPath   =   this.Server.MapPath(Request.PhysicalApplicationPath);         你要说明什么“类文件”。任何PAGE、CONTROL代码也是在类中的。         上面的this只针对Page对象，针对con
将图片保存到数据库表中及从数据库表中读取图片并显示
aimcode
12-31 1546
一.页面文件.aspx                              Text=UpFile onclick="btnUpFile_Click" />                                      onclick="btnDisplayPicture_Click"
asp.net表单提交数据
最新发布
05-13
- 在后台代码中，使用 ASP.NET Web API 或者 ASP.NET Core API 来处理 AJAX 请求，并返回 JSON 格式的数据。 - 在前端页面中，使用 JavaScript 来处理 AJAX 响应，并根据返回的数据来更新页面。 以上是几种常见的 ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值