您好,登錄后才能下訂單哦!
這篇文章給大家介紹ajax中怎么通過異步加載實現局部刷新,內容非常詳細,感興趣的小伙伴們可以參考借鑒,希望對大家能有所幫助。
[html] view plain copy
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-2.1.0.js"></script>
<script type="text/javascript">
$(function(){
$("#inp1").blur(function(){
var name=$(this).val();
$.ajax({
url:"${pageContext.request.contextPath}/demo",
data:{"uname":name,"upwd":"jack123","age":12},
cache:"false",
async:"true",
dataType:"json",
type:"post",
success:function(data){
if(data.flag=="1"){
$("#sp").html("用戶名存在");
}else{
$("#sp").html("");
}
},
error:function(){
alert("服務器端異常");
}
});
});
})
</script>
<title>Insert title here</title>
</head>
<body>
<input type="text" value="" id="inp1"><span id="sp"></span>
</body>
</html>
jquery封裝的ajax 進行數據交互, 實現異步加載
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-2.1.0.js"></script>
<script type="text/javascript">
var json={
"flag":"1"
};
//alert(json.flag);
$(function(){
//$.get(url,data,success(data,status,xhr),dataType)
$("#btn").click(function(){
$.get(
"${pageContext.request.contextPath}/demo",
{"uname":"jack","upwd":"123","age":12},
function(data,status){
//var data={"flag":"1"}
alert(data);
if(data.flag=="1"){
$("#sp").html("用戶名已經被占用").css("color","red");
}else{
$("#sp").html("用戶名可以使用").css("color","green");
}
},
"json"
);
})
});
</script>
</head>
<body>
<input type="button" id="btn" value="$.get異步請求服務器"><span id="sp">
</body>
關于ajax中怎么通過異步加載實現局部刷新就分享到這里了,希望以上內容可以對大家有一定的幫助,可以學到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。