/*****
*****验证form表单的数据
*****
*****
********/
function CheckForm(oForm)
{
var els = oForm.elements;
//遍历所有表元素
//alert(els.length);
for(var i=0;i<els.length;i++)
{
//alert(els[i].getAttribute("check"));
//是否需要验证
if(els[i].getAttribute("check")!=""&&els[i].getAttribute("check")!="undefined"&&els[i].getAttribute("check")!=null)
{
//alert("14"+els[i].getAttribute("check"));
//取得验证的正则字符串
var sReg = els[i].getAttribute("check");
//alert(sReg);
//取得表单的值,用通用取值函数
var sVal = GetValue(els[i]);
//字符串->正则表达式,不区分大小写
var reg = new RegExp(sReg,"i");
if(!reg.test(sVal))
{
//验证不通过,弹出提示warning
alert(els[i].getAttribute("warning"));
//该表单元素取得焦点,用通用返回函数
GoBack(els[i]);
return false;
}
}
}
}
//通用取值函数分三类进行取值
//文本输入框,直接取值el.value
//单多选,遍历所有选项取得被选中的个数返回结果"00"表示选中两个
//单多下拉菜单,遍历所有选项取得被选中的个数返回结果"0"表示选中一个
function GetValue(el)
{
//取得表单元素的类型
var sType = el.type;
//alert(el.type);
switch(sType)
{
case "text":
case "hidden":
case "password":
case "file":
case "textarea": return el.value;break;
case "checkbox":
case "radio": return GetValueChoose(el);break;
case "select-one":
case "select-multiple": return GetValueSel(el);break;
}
//取得radio,checkbox的选中数,用"0"来表示选中的个数,我们写正则的时候就可以通过0{1,}来表示选中个数
function GetValueChoose(el)
{
var sValue = "";
//取得第一个元素的name,搜索这个元素组
var tmpels = document.getElementsByName(el.getAttribute("name"));
for(var i=0;i<tmpels .length;i++)
{
if(tmpels[i].checked)
{
sValue += "0";
}
}
return sValue;
}
//取得select的选中数,用"0"来表示选中的个数,我们写正则的时候就可以通过0{1,}来表示选中个数
function GetValueSel(el)
{
var sValue = "";
for(var i=0;i<el.options.length;i++)
{
//单选下拉框提示选项设置为value=""
if(el.options[i].selected && el.options[i].value!="")
{
sValue += "0";
}
}
return sValue;
}
}
//通用返回函数,验证没通过返回的效果.分三类进行取值
//文本输入框,光标定位在文本输入框的末尾
//单多选,第一选项取得焦点
//单多下拉菜单,取得焦点
function GoBack(el)
{
//取得表单元素的类型
var sType = el.type;
switch(sType)
{
case "text":
case "hidden":
case "password":
case "file":
case "textarea": el.focus();var rng = el.createTextRange(); rng.collapse(false); rng.select();break;
case "checkbox":
case "radio": var els = document.getElementsByName(el.getAttribute("name"));els[0].focus();break;
case "select-one":
case "select-multiple":el.focus();break;
}
}
分享到:
相关推荐
在提交表单后,服务器端需要接收并处理这些数据。在PHP中,可以使用 `$_POST` 超全局数组来访问这些通过POST提交的变量。例如,如果表单有一个名为 "username" 的字段,那么在PHP中可以通过以下方式获取其值: ```...
AJAX(Asynchronous JavaScript and XML)是一...通过对AJAX提交表单数据的方法的分析,以及实例的详细解读,我们可以更好地理解这一技术的核心概念和实现细节,进而在实际开发中有效应用,提升应用的性能和用户体验。
POST方法则将数据放在请求体中,可以传输大量数据,如表单提交、文件上传等。 在C++中实现HTTP请求,通常需要创建一个HTTP连接类,比如`HttpConnection`,它封装了发送请求、接收响应的过程。`HttpConnection.cpp`...
封装后的请求模块可以设置全局的请求头、默认参数,还可以添加拦截器来处理请求前后的逻辑,如添加loading、验证token等。 **Vuex** 是Vue.js的状态管理模式,用于管理组件之间的共享状态。在uni-app中使用Vuex,...
4. `<button>`:创建按钮,可以是提交表单的submit类型,也可以是重置表单的reset类型,或者自定义操作的button类型。 接着,表单的交互性是通过JavaScript来增强的。例如,我们可以使用事件监听器(如onChange、...
- **`action`**:提交表单时的数据发送地址。 - **`method`**:提交表单的方式,常见的有GET和POST两种方式。 表单的基本结构如下所示: ```html 表单ID" name="表单名称" action="提交地址" method="提交方式...
本文将深入探讨OkHttp3的使用和封装,旨在帮助开发者更好地理解和掌握这一强大的网络请求工具。 首先,让我们了解OkHttp的基本概念。OkHttp是由Square公司开发的,它提供了一个高效的HTTP客户端接口,具有缓存、...
最后,文章指出,使用JavaScript和正则表达式进行表单验证具有较好的参考价值,并鼓励大家学习和应用。同时,文章还感谢了读者的支持。 整篇文章通过具体的实例,展示了前端开发中表单验证的完整流程。不仅提供了...
在本资源中,"易语言post提交模块源码" 提供了一种实现HTTP POST请求的方法,这对于网络编程,特别是涉及到数据提交、网页表单处理或者API接口调用的应用开发非常重要。 POST提交是HTTP协议中的一个基本方法,用于...
这种方法适用于表单字段较少且不复杂的情况,但当表单字段多时,手工收集和封装数据可能会变得繁琐且容易出错。 **方式二:使用jQuery的`serialize()`方法** `serialize()`方法可以自动遍历表单内的所有元素,将...
3. **表单验证**:在用户提交表单前,应用通常需要对输入进行验证,确保数据的完整性和正确性。例如,邮箱地址的格式检查、电话号码的格式验证等。这个源码可能包含了这些验证逻辑,你可以通过查看代码来学习如何...
结合冒泡排序和表单标签,我们可以想象一个教学场景:一个网页教程可能包含一个交互式的冒泡排序演示,用户可以通过输入一组数字,然后通过表单提交,网页后端接收到数据后用冒泡排序算法对这些数字进行排序,并将...
用户触发的事件(比如点击按钮)会调用封装好的AJAX函数,实现与服务器的数据交互,并根据返回结果执行相应的操作。 总的来说,通过上述介绍,我们可以看到利用纯JavaScript封装AJAX功能函数不仅可以实现与服务器端...
* 实现实时验证:使用 Ajax 可以实现在表单提交前进行实时验证。 * 实现动态加载数据:使用 Ajax 可以实现在不刷新页面的情况下加载数据。 Ajax 的优缺点 ------------- Ajax 的优点我们已经提到过,下面是 Ajax ...
1. **函数库和组件**:这个压缩包中包含了多个JavaScript的函数库和组件,它们可能包括动画效果、事件处理、DOM操作、Ajax通信、表单验证、日期时间处理、图形绘制等多个方面的功能。这些封装好的代码模块可以帮助...
当用户提交表单时,这个字符串会被发送回服务器,然后ASP.NET框架会反序列化这些数据,恢复页面的状态。然而,ViewState也增加了页面的大小,因此在处理大量数据或对性能有严格要求的场景下需要谨慎使用。 表单内容...
在Web开发中,分页是一种常见的数据展示方式,特别是在处理大量数据时,它能提高用户体验,使得用户可以逐步浏览信息,而不会一次性加载...同时,这种技术方案也具有较好的可扩展性,可以适应不同的数据源和应用场景。
这一特性对于创建动态表单、验证和实时数据更新非常有用。 **Angular指令封装** 在Angular中,指令(Directives)是一个核心概念,允许开发者封装可重用的HTML标记行为。通过创建指令,开发人员可以向DOM元素添加...
通过数据驱动测试,我们可以以较少的代码覆盖更多的测试场景,同时保持测试代码的整洁和可读性。对于有代码阅读能力的开发者来说,理解和维护这样的测试代码会相对容易。不过,对于初学者而言,理解并熟练运用这些...