想使用validation_cn.js做一个javaeye提交的效果,现在终于做出来了,与大家分享。不好意思,上次的版本不能使用,是因为vaidation_cn.js引起file文件的问题,上次我是jsp做的,好像可以,html的话,去掉file既可以了,源代码请见附件。
附代码如下:
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<script src="js/prototype.js" type="text/javascript"></script>
<!-- 动态效果的js -->
<script src="js/effects.js" type="text/javascript"></script>
<script src="js/validation_cn_cust.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="css/style_min.css" />
<style>
body td {
color: #333;
font-family: Arial, Helvetica, sans-serif;
font-size: 10pt;
}
.validation-advice {
margin: 5px 0;
padding: 5px;
background-color: #DFF3FB;
color : #FF3300;
font-weight: bold;
}
</style>
<script type="text/javascript">
function window_onload() {
//表单的第一个元素获得焦点
Form.focusFirstElement("form1");
}
</script>
</head>
<body onLoad="window_onload()">
<div align="center">
<form id="form1" name="form1" method="post">
<br><input name="a" class="required"><br>
<input name="b" class="required"><br>
<input name="c" class="required"><br>
<input name="d" class="required"><br><br>
<div id="commit" style="display:block">
<input type="button" name="Submit" value="提交" onclick="checkSubmit()">
<input type="button" name="btn2" value="重置" onClick="validation.reset(); return false">
<input id="btn3" type="button" name="btn3" value="取消" onClick="history.go(-1)">
</div>
<div id="commiting" style="display:none"><img src="images/loading.gif">正在提交...</div>
</form>
</div>
</body>
<script type="text/javascript">
var validation = new Validation("form1",{immediate:true,useTitles:true,stopOnFirst:false});
function checkSubmit() {
var f = $("form1");
//自动验证,手动提交
if(validation.validate()) {
alert("成功!");
//form.Submit.disabled = true;
$("commiting").style.display = "block";
$("commit").style.display = "none";
//alert($("commit").value)//; = "<img src="images/loading.gif">正在提交...";
//alert($("commit").innerHTML);
//$("commit").innerHTML = '<img src="images/loading.gif">正在提交...';
f.action = "http://blog.donews.com/limodou/archive/2005/06/21/439285.aspx";
f.submit();
} else {
//form.Submit.disabled = false;
//$("commiting").style.display = "none";
}
}
</script>
</html>
在onclick的时候,进行验证,避免重复点击提交按钮,进入等待状态。
分享到:
相关推荐
总之,"Validation_mini"控件为Web开发者提供了一个简洁高效的表单验证解决方案,通过"Validation_mini.js"脚本和"使用说明.txt"文档,我们可以轻松地在网站上实现各种表单验证,保证数据的有效性和一致性,从而提升...
它简化了原本繁琐的JavaScript验证代码,提供了一套完整的验证规则和自定义错误消息的方法。主要特性包括: 1. **自动绑定**:只需简单的配置,即可自动对表单元素进行验证,无需编写额外的事件监听代码。 2. **...
1. **源代码**:可能是用各种编程语言(如C#、Java、JavaScript或VB.NET)编写的验证控件实现。源代码会包含验证逻辑,如正则表达式用于数据格式检查,以及在数据无效时显示错误消息的方法。 2. **演示示例**:通常...
4. **国际化支持**:`validation_cn.js`表明该库支持中文语言,方便了中文用户的使用。 5. **轻量级**:尽管包含了多种功能,但`validation.js`仍保持了较小的体积,不会显著增加页面加载时间。 6. **可扩展性**:...
jQuery的生态系统中有大量的第三方插件,如用于表格排序的jQuery DataTables,图片轮播的jQuery Carousel,表单验证的jQuery Validation等。这些插件通过扩展jQuery的功能,极大地丰富了开发者的选择。 总结,...
可以使用JavaScript库如jQuery Validate或React的Formik等进行前端输入验证,防止无效数据提交到服务器。 8. **安全考虑**:输入验证不仅是格式检查,还需防范SQL注入、跨站脚本攻击(XSS)等安全问题。例如,使用预...
《快速验证: Rapid_Validation_1.5.1——网页前端验证的jQuery插件详解》 在Web开发中,前端验证扮演着至关重要的角色,它能够有效地减少无效数据提交,提高用户体验,避免服务器不必要的负载。 Rapid_Validation_...
`FormValidation.js` 是一个强大且灵活的JavaScript库,专门用于前端表单验证。它提供了丰富的校验规则、样式定制以及对动态添加元素的验证支持,使得开发者能够轻松地创建高效、用户体验良好的表单验证系统。本文将...
此外,项目可能还包含了其他支持文件,如JSP页面、CSS样式表、JavaScript脚本等,它们共同构成了一个完整的Struts验证示例。 学习和理解Struts的验证机制对于开发健壮的Java Web应用至关重要。通过这个实验项目,...
jquery.validate Validation .js验证框架 帮助 手册 文档.chm 版本 方面查询 (一)、可选项( options ) 1 (二)插件方法 (jQuery validation) 6 (三、四)选择器及实用工具 (jQuery validation) 7 四、实用工具...
1. **前端验证**:前端验证主要发生在用户在网页上填写表单时,通过JavaScript或者特定的验证库(如本例中的`validation.js`和`validation_cn.js`)对输入的数据进行实时检查。这些库可以帮助开发者创建自定义规则,...
jQuery拥有庞大的插件生态系统,如jQuery UI提供丰富的用户界面组件,jQuery Validation用于表单验证,jQuery ScrollTo实现页面滚动效果,等等。这些插件极大地扩展了jQuery的功能。 八、性能优化 在使用jQuery时,...
- **常用插件**:如jQuery UI提供丰富的UI组件,jQuery Form Plugin处理表单提交,jQuery Validation Plugin进行表单验证。 7. **兼容性与性能优化** - **浏览器兼容**:jQuery 1.x系列对旧版浏览器有较好的兼容...
jQuery拥有丰富的插件生态,如jQuery UI用于创建用户界面,jQuery Validation用于表单验证。通过`$.fn.extend()`方法,开发者可以自定义插件,扩展jQuery的功能。虽然“jquery_box.zip”未明确提及插件,但学习如何...
该js经过修改后 非空验证,增加了全是空格的验证。很实用的(非空验证,考虑了全是空格的情况)
"Validation JS"是一种流行的JavaScript库,专门用于客户端的表单验证。它允许开发者轻松地定义验证规则,并在用户提交表单前进行实时检查。 **1. 基本概念** - **JavaScript表单验证**:JavaScript是一种在浏览器...
jQuery 插件使客户端表单验证变得容易,同时仍然提供了大量的自定义选项。如果您要从头开始构建新的东西,或者当您试图将某些东西集成到具有大量现有标记的现有应用程序中时,它都是一个不错的选择。该插件捆绑了一...
jQuery拥有庞大的插件生态系统,如jQuery UI提供了丰富的用户界面组件,jQuery Form Plugin简化了表单提交,jQuery Validation Plugin用于表单验证,这些插件极大地扩展了jQuery的功能。 八、jQuery 1.8.3的改进 在...
`validation_app_engine`库可能是一个用于Google App Engine应用程序的验证工具,帮助开发者确保输入数据的正确性和安全性。Google App Engine是一个平台即服务(PaaS)产品,允许开发者在Google的基础设施上运行web...