`
cakin24
  • 浏览: 1386684 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

表单提交的验证

阅读更多

 

一 应用
提交表单时,通过onsubmit事件来判断表单中是否有空文本框,如果有,则不允许提交,并通过表单的onreset事件将表单中的文本框清空,以便重新输入信息。
 
二 代码
<table width="487" height="333" border="0" align="center" cellpadding="0" cellspacing="0" background="bg.JPG">
 <tr>
 <td align="center" valign="top"><br>
 <br>
 <br>
 <br> <br> <table width="86%" border="0" align="center" cellpadding="2" cellspacing="1" bgcolor="#6699CC">
 <form name="form1" onReset="return AllReset()" onsubmit="return AllSubmit()">
 <tr bgcolor="#FFFFFF">
 <td height="22" align="right">所属类别:</td>
 <td height="22" align="left">  
 <select name="txt1" id="txt1">
 <option value="数码设备">数码设备</option>
 <option value="家用电器">家用电器</option>
 <option value="礼品工艺">礼品工艺</option>
 </select>
 <select name="txt2" id="txt2">
 <option value="数码相机">数码相机</option>
 <option value="打印机">打印机</option>
 </select></td>
 </tr>
 <tr bgcolor="#FFFFFF">
 <td height="22" align="right">商品名称:</td>
 <td height="22" align="left"><input name="txt3" type="text" id="txt3" size="30" maxlength="50"></td>
 </tr>
 <tr bgcolor="#FFFFFF">
 <td height="22" align="right">会员价:</td>
 <td height="22" align="left"><input name="txt4" type="text" id="txt4" size="10"></td>
 </tr>
 <tr bgcolor="#FFFFFF">
 <td height="22" align="right">提供厂商:</td>
 <td height="22" align="left"><input name="txt5" type="text" id="txt5" size="30" maxlength="50"></td>
 </tr>
 <tr bgcolor="#FFFFFF">
 <td height="22" align="right">商品简介:</td>
 <td height="22" align="left"><textarea name="txt6" cols="35" rows="4" id="txt6"></textarea></td>
 </tr>
 <tr bgcolor="#FFFFFF">
 <td height="22" align="right">商品数量:</td>
 <td height="22" align="left"><input name="txt7" type="text" id="txt7" size="10"></td>
 </tr>
 <tr bgcolor="#FFFFFF">
 <td height="22" colspan="2" align="center"><input name="sub" type="submit" id="sub2" value="提交">
&nbsp;
 <input type="reset" name="Submit2" value="重 置"></td>
 </tr>
 </form>
 </table></td>
 </tr>
</table>
<script language="javascript">
<!--
function AllReset()
{
 if (window.confirm("是否进行重置?"))  //弹出提示框
 return true;
 else
 return false;
}
function AllSubmit()
{
 var T=true;
 var e=window.event;
 var obj=e.srcElement;
 for (var i=1;i<=7;i++) //按指定名称遍历表单中的控件
 {
 if (eval("obj."+"txt"+i).value=="") //判断当前控件的值是否为空
 {
 T=false;
 break;  //退出本次循环
 }
 }
 if (!T)  //当表单中的控件有空值时
 {
 alert("提交信息不允许为空");
 }
 return T; //返回布尔型值
}
//-->
</script>
 
 
三 运行结果
图7_19.png
  • 大小: 11.9 KB
1
0
分享到:
评论

相关推荐

    jQuery完整注册表单提交验证

    在本文中,我们将深入探讨如何使用jQuery实现一个完整的用户注册表单提交验证。这个验证系统包括了多个关键的验证环节,如用户名、密码强度、显示/隐藏密码、手机号码输入控制以及手机验证码、真实姓名和身份证号的...

    Dreamweaver表单提交验证插件

    Dreamweaver表单提交验证插件是一款专为Adobe Dreamweaver设计的强大工具,它极大地提升了网页开发者在创建交互式表单时的效率和用户体验。在Web开发中,表单是收集用户信息、实现用户与服务器间数据交互的重要手段...

    Js 表单提交验证函数(很全了)

    在JavaScript中,表单提交验证是确保用户输入的数据符合预设规则的重要环节,这有助于防止无效数据的提交,提升用户体验,以及保护服务器免受恶意数据的冲击。本篇将详细介绍JavaScript表单验证函数的一些关键知识点...

    jQuery完整注册表单提交验证.zip

    "jQuery完整注册表单提交验证"是一个针对此需求的解决方案,它提供了全面的验证功能,确保用户输入的数据符合预期,同时减少了服务器端的压力。本文将深入探讨jQuery如何实现这一功能,以及如何将其应用于实际项目中...

    表单提交验证特效

    表单提交验证特效则是确保用户输入有效、符合预期的关键步骤。这一技术涵盖了多种验证方法和用户体验设计,旨在提供一个友好且安全的用户界面。下面将详细讨论表单验证的重要性和实现方法。 1. **表单验证的重要性*...

    表单提交验证

    在网页开发中,表单提交验证是至关重要的一个环节,它确保了用户输入的数据符合预设的规则,防止无效或恶意的数据进入系统。本项目主要针对前端开发者,特别是初学者,旨在通过实践来理解如何使用JavaScript进行表单...

    from表单提交验证框架

    总结来说,"from表单提交验证框架"是基于jQuery和正则表达式的轻量级解决方案,它简化了Web表单验证的过程,让开发者能更专注于业务逻辑,而不是基础的验证逻辑。通过合理的配置和使用,可以大大提高开发效率和用户...

    绝对周全的Asp.net表单提交验证方案 PDF

    在Asp.net开发中,表单提交验证是一个关键环节,它确保了用户输入的数据符合预设的规则,防止无效数据的存储或处理,从而保证系统的稳定性和安全性。这份"绝对周全的Asp.net表单提交验证方案"PDF提供了一个详尽的...

    js-实现原生表单提交验证.zip

    原生js表单提交验证代码下载。原生JavaScript实现,适合新手学习js。用户填写完成后,点击提交按钮,判断填写的信息是否符合要求,如不符合将弹出相应的修改信息要求,引导用户正确填写表单。

    背景动画用户登录界面表单提交验证代码

    "背景动画用户登录界面表单提交验证代码"是一个专为提升登录页面交互体验而设计的实例,它融合了动态背景动画和有效的表单验证技术。下面将详细讲解其中涉及的关键知识点。 1. **背景动画**:背景动画是提升网页...

    jquery表单提交验证插件

    jquery/validation_engine表单提交验证,简单实用。将css和js引用,并在需要验证的元素class中填写相应参数,以及表单提交的方法中进行验证 $("#userForm").validateEngine("validate")。在项目中已经实用,很方便。

    带流程的注册表单提交验证html模板.zip

    "带流程的注册表单提交验证html模板.zip"提供了一个完整的解决方案,帮助开发者创建具有多步骤、验证功能的注册表单,提升用户交互体验。下面我们将详细探讨这个模板中的关键知识点。 1. **HTML模板设计**:HTML...

    一款HTML5登陆界面表单提交验证特效.zip

    【标题】"一款HTML5登陆界面表单提交验证特效.zip" 涉及的主要知识点是HTML5中的表单处理和前端验证技术。HTML5作为现代Web开发的核心语言,提供了更强大的表单控制和数据验证功能,使得开发者可以构建更加用户友好...

    jQuery支持拖动的弹出窗口登录和注册表单提交验证特效

    本主题聚焦于"jQuery支持拖动的弹出窗口登录和注册表单提交验证特效",这是一个常见且实用的功能,适用于网页中的用户交互设计。 首先,我们来了解jQuery中的拖动功能。在jQuery UI库中,提供了`draggable()`方法,...

    jquery validate表单验证插件制作注册表单提交验证

    `submitHandler`函数会在所有验证通过后被调用,你可以在这里放置处理表单提交的逻辑,例如使用AJAX向服务器发送数据。如果验证失败,`submitHandler`不会执行,表单不会被提交,从而防止无效数据的提交。 为了增强...

    常用的表单提交验证脚本

    常用的表单提交javascript验证脚本,有详细的使用说明

Global site tag (gtag.js) - Google Analytics