【web++_第三阶_Ajax_Rest篇】Ajax 第一篇：基础解释和联系，附解释与Rest关系_3

本文介绍了一个简单的网页表单验证示例，利用JavaScript和Ajax实现手机号输入验证及远程数据请求处理。通过jQuery简化了DOM操作和Ajax调用过程，并展示了如何解析JSON响应。

<span style="font-family: Arial, Helvetica, sans-serif;"><%@ page language="java" import="java.util.*" pageEncoding="gb2312"%></span>

<html>
<head>
	<script type="text/javascript" src="jquery-1.4.4.min.js"></script>
	<script type="text/javascript">
		function valiMoblie(obj) {
			if ($(obj).val() != "") {
				if (!(/^[1-9]\d*$/.test($(obj).val()))) {
					$(obj).val("");
				}
			}
		}
		
		function myEval() {   
    		var str = '{ "name": "Violet", "occupation": "character" }';   
    		var obj = str.parseJSON();   
    	 	alert(obj.toJSONString());   
		} 
		
		function jsonResponse(originalRequest) {
			alert(originalRequest.responseText);
			var myobj = originalRequest.responseText.parseJSON();
			alert(myobj.name);
		}
		
		function sendRequest() {
			// var carr = new Car("Dodge", "Coronet R/T", 1968, "yellow");
			var pars = "car=" + "carr.toJSONString";
			
			var turl = "zyxAjax/ajax.do";
			alert("aaaa");
			$.ajax({
				url : turl,
				type : 'get',
				dataType : 'json',
				data : pars,
				success : function (reponseData) {
					alert(reponseData);
					// var myobj = originalRequest.responseText.parseJSON();
					alert(reponseData.name);
				}
			});
		}
	</script>
</head>
<body>
	<form >
		<span style="font-size:13px;margin-left:30px;" >手机号</span>
		<input type="text" style="margin-top:20px;" id="userMMsPhone" maxlength="11" onkeyup="valiMoblie(this)"/>
		<input type="button" onclick="sendRequest();"width="20" value="查询"/>
	</form>
</body>
</html>