`
lyllong3
  • 浏览: 5512 次
  • 性别: Icon_minigender_1
  • 来自: 成都
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

js form 提交验证

阅读更多

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>

  <script type="text/javascript" src="../../js/jquery-1.4.2.min.js"></script>
  <script type="text/javascript">
  	$(function(){
  		$("#name").keyup(function(){
  		 	var obj = $(this);
  			$.getJSON("searchDishByNameAjax",{name:$(this).val()},function(data){
  				if(data == "1"){
  					var name = obj.val();
  					if($("#add").length >0){
  						$("#add").html(name+"已存在,请输入其它菜名。");
  						return;
  					}
  					$("<div/>").css("border","solid 1px #FF0000").attr("id","add").html(name+"已存在,请输入其它菜名。").insertAfter(obj);
  				}else{
  					$("#add").remove();
  				}
  			});
  			var name = $(this).val(); 
  		});
  		//下面表示只可以输入数字和一个点号
  		$("#price").keydown(function(event){
  			var code = event.keyCode;
  			if((code >= 48 && code <= 57) || code == 110 || code == 190){
  				if((code == 110 || code == 190) && $(this).val().indexOf(".") >= 0){
  					return false;
  				}
  				return true;
  			}
  			else{ 
  				event.keyCode = 0;
   				return false;
  			}
  		}) 
  	});
  	
  	function onSubmit(){ 
  		if($("#add").length>0)
  			return false;
  		$("#addDish")[0].submit();		
  	};
  </script>
  </head>
  
  <body>
     <form id = "addDish" action = "addDish" method = "post" ">
		<table>
			<tr>
				<th>
					菜名
				</th>
				<td>
					<input type = "text" id = "name" name = "dish.name"  />
				</td>
			</tr>
			<tr>
				<th>
					菜价
				</th>
				<td>
					<input type = "text" id = "price" name = "dish.price" maxlength = "8"/>
				</td>
			</tr>
			<tr>
				<th>
					说明
				</th>
				<td>
					<textarea  id = "comm" name="dish.comm" style="margin-left: 2px; margin-right: 2px; width: 540px; margin-top: 2px; margin-bottom: 2px; height: 184px; ">						 
					</textarea>
				</td>
			</tr>
			<tr>
				<td></td>
				<td>
					<span style = "margin-left:20px;text-decoration : underline;" onclick = "onSubmit();">确定</span>
					<span style = "margin-left:20px;text-decoration : underline;"><a href = "showDish">返回</a></span>
				</td>
			</tr>
		</table>     
     </form>
  </body>
</html>
 
分享到:
评论

相关推荐

    表单验证js 提交前验证

    本压缩包包含了一个名为"validateForm.js"的JavaScript文件以及一份"表单验证说明.txt"的文本文件,它们专门用于实现前端的表单验证功能。 `validateForm.js` 是一个JavaScript函数库,它提供了对HTML表单字段的...

    JS验证页面form表单数据,齐全

    在form表单上添加一个提交事件调用验证数据方法 &lt;form name="listform" action="resume-doAdd" method="post" onsubmit="return Validator.Validate(this,3);"&gt; 请输入正确的手机号!" requiremsg="移动电话不能为...

    Form验证框架 JS

    "Form验证框架 JS"就是针对这一需求而诞生的专门用于JavaScript表单验证的框架。 **验证框架的核心功能** 1. **实时验证**: 表单验证框架能够实时检查用户输入,当用户在输入框中输入内容时立即进行验证,及时反馈...

    js验证form对话框

    在网页表单(form)交互中,JS验证扮演着关键角色,它能确保用户输入的数据符合预设的规则,从而提高用户体验并减轻服务器端的压力。本主题将深入探讨如何使用JavaScript进行表单验证,包括检查输入是否为空、验证...

    jquery.form提交方式

    《jQuery Form 提交方式详解》 在Web开发中,jQuery库极大地简化了JavaScript操作,特别是在处理表单提交方面。本文将深入探讨jQuery中处理表单提交的多种方式,结合源码解析,帮助开发者更好地理解和应用。 一、...

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

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

    js提交表单及js表单验证

    ### JS提交表单及JS表单验证 在Web开发中,JavaScript经常被用来增强用户体验,其中一个重要的应用领域就是表单验证。通过JavaScript进行前端验证,可以及时反馈用户输入错误,提高交互效率。本文将详细解释如何...

    vue element el-form多表单验证.txt

    而在使用 Vue.js 搭配 Element UI 进行开发时,我们经常会遇到需要对多个表单进行同时验证的需求。本文将详细介绍如何通过 Promise 的方法实现 Vue Element UI 中的多表单验证。 #### 一、Vue Element UI 表单验证...

    .net javascript form 验证

    在.NET开发中,JavaScript常被用来进行前端表单验证,以提供用户友好的交互体验,减少服务器端不必要的处理。本文将详细讲解如何使用JavaScript进行表单验证,以及结合ASP.NET来实现这一功能。 首先,从给出的代码...

    form_login 表单验证 客户端验证

    综上所述,"form_login"表单验证主要涉及客户端JavaScript验证和服务器端Servlet处理。客户端验证提供了即时反馈,提升了用户体验,而服务器端验证则确保了数据的安全性。在实际开发中,两者通常结合使用,以提供...

    jquery的form表单验证

    **jQuery Form 表单验证详解** 在Web开发中,用户输入的数据验证是不可或缺的一部分,它确保了用户提交的信息符合预设的格式和规则,从而保证数据的准确性和系统的稳定性。jQuery,作为一款广泛使用的JavaScript库...

    asp.net的Form验证

    客户端验证则在用户提交数据前在浏览器端进行,可以提供即时反馈,提高用户体验,常见的有JavaScript或jQuery插件如jQuery Validation Plugin。 在VS2012中,我们可以直接在设计视图中拖放这些验证控件到表单中,并...

    js提交表单及js表单验证大全

    根据提供的文件信息,我们可以总结出一系列关于JavaScript在处理表单提交及验证方面的知识点。下面将对这些知识点进行详细的解析。 ### 1. 验证文本框输入长度不超过50个字符 ```javascript function test() { if...

    Django之Form表单验证及Ajax验证方式汇总

    2. **创建Ajax请求**:在`login_js.html`或`login.html`的JavaScript代码中,我们可以监听表单的提交事件,然后发送Ajax请求: ```javascript $(document).ready(function() { $('form').on('submit', function...

    FormValidation验证源代码

    FormValidation是一款强大的JavaScript库,专为前端开发人员设计,用于实现高效、灵活的表单验证。这个库提供了丰富的验证规则,如电子邮件验证、电话号码验证和身份证验证,以确保用户输入的数据符合预设的格式和...

    FormValidation.js

    `FormValidation.js` 是一个强大且灵活的JavaScript库,专门用于前端表单验证。它提供了丰富的校验规则、样式定制以及对动态添加元素的验证支持,使得开发者能够轻松地创建高效、用户体验良好的表单验证系统。本文将...

    js表单验证(含自定义)

    本文将深入探讨JavaScript(简称js)在表单验证中的应用,包括基础验证方法以及如何实现自定义验证。 一、JavaScript表单验证基础 1. 验证事件:在JavaScript中,我们可以监听表单的`submit`事件,当用户尝试提交...

    ajaxForm异步提交表单(含图片)

    // 提交前的回调函数,可以进行预处理或验证 }, success: function(response, status, xhr, $form) { // 提交成功后的回调函数,处理服务器返回的数据 }, error: function(xhr, status, error) { // 错误处理...

    Form表单验证(服务器控件、HTML控件)

    JavaScript验证可以在用户提交表单前在客户端进行,提高用户体验。以下是一些基本步骤: 1. 事件监听:通过addEventListener或attachEvent方法监听表单的submit事件。 2. 验证逻辑:在事件处理函数中,编写...

Global site tag (gtag.js) - Google Analytics