1. 程式人生 > 其它 >跨域傳送非同步請求的兩種方式

跨域傳送非同步請求的兩種方式

跨域傳送非同步請求的兩種方式

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script src="http://localhost:8060/JSON_war_exploded/jquery.min.js"></script>
		<script>
			function funmove(){
			            //id的屬性用$("#id")獲取
			            //判斷她為空的話,給span一個文字發生
			            if (null== $("#userid").val()||''==$("#userid").val()){
			                 $("#spanid").text("使用者名稱不能為空")
			                return
			            }
			            //這裡是使用者看到後進行輸入,再次執行清空sqan的操作;就不執行if了
			            $("#spanid").text("")
			            //傳送非同步請求
			            $.ajax(
			                {
			                    type:"GET",//method的方式
			                    url:"http://localhost:8060/JSON_war_exploded/unameCheckServlet.do?",// 請求的後臺服務的路徑
			                    data:{username:$("#userid").val()},// 提交的引數
								dataType:"jsonp",
								jsonp:"aaa",
			                    success:function (msg) {// 響應成功執行的函式
			                        $("#spanid").text(msg)
			                    }
			                }
			            )
			        }
		</script>
	</head>
	<body>
		<form method="get" action="unameCheckServlet.do">
		    賬號:<input id="userid" name="username" type="text" onblur="funmove()">
		    <span id="spanid" style="color: red"></span><br/>
		    密碼:<input name="password" type="password"><br/>
		    <input type="submit" value="提交">
		</form>
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script src="http://localhost:8060/JSON_war_exploded/jquery.min.js"></script>
		<script>
			function funmove(){
			            //id的屬性用$("#id")獲取
			            //判斷她為空的話,給span一個文字發生
			            if (null== $("#userid").val()||''==$("#userid").val()){
			                 $("#spanid").text("使用者名稱不能為空")
			                return
			            }
			            //這裡是使用者看到後進行輸入,再次執行清空sqan的操作;就不執行if了
			            $("#spanid").text("")
			            //傳送非同步請求

						$.getJSON(
						"http://localhost:8060/JSON_war_exploded/unameCheckServlet.do?jsoncallback=?",
						{username:$("#userid").val()},
						function (msg) {// 響應成功執行的函式
						    $("#spanid").text(msg)
						}
						)
			        }
		</script>
	</head>
	<body>
		<form method="get" action="unameCheckServlet.do">
		    賬號:<input id="userid" name="username" type="text" onblur="funmove()">
		    <span id="spanid" style="color: red"></span><br/>
		    密碼:<input name="password" type="password"><br/>
		    <input type="submit" value="提交">
		</form>
	</body>
</html>