JQuery検証

2440 ワード

すべてのフォーム要素がページのロード後に決定された場合は、次のように検証できます.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
 <style type="text/css">
    #messageBox{
		background: white;
	}
	.success{
		background: green;
	}
	.failure{
		background: red;
	}
 </style>
  <SCRIPT LANGUAGE="JavaScript" src="jquery-1.3.2.min.js"> </SCRIPT>
  <SCRIPT LANGUAGE="JavaScript" src="jquery.validate.js"> </SCRIPT>
  <SCRIPT LANGUAGE="JavaScript">
  /*
	                  ,
	              
  */
	$(document).ready(function(){
	/*
		$.validator.setDefaults({       
			submitHandler: function(form) {    
				form.submit();    
			}       
		}); 

		$("#form").validate({
			/*
			highlight: function(element, errorClass) {
			 $(element).fadeOut(function() {
				$(element).fadeIn()
			 })
			},
			*/
			//validClass:"valid",
			errorClass:"failure",
        	errorLabelContainer: "#messageBox",
			wrapper: "div",
			rules:{
				"name":{required:true},
				"value":{required:true}
			},
			messages:{
				"name":{required:"name required"},
				"value":{required:"value required"}
			},
			success:function(label){
				//label.text("OK");
			}
		});
		*/
	})

  </SCRIPT>
 </HEAD>

 <BODY>
	<ul id="messageBox">
	</ul>
  <FORM METHOD=POST ACTION="" id="form">
	<INPUT TYPE="text" NAME="name" /><br/>
	<INPUT TYPE="text" NAME="value" ><br/>
	<INPUT TYPE="submit">
  </FORM>
 </BODY>
</HTML>