JQuery中的ajax实现

最新推荐文章于 2024-07-15 22:52:27 发布

� 很皮很天真

最新推荐文章于 2024-07-15 22:52:27 发布

阅读量119

点赞数

分类专栏： javaweb

本文链接：https://blog.csdn.net/lzhdekl/article/details/116331825

版权

javaweb 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

JQuery中的ajax实现
1.导入jquery包
2.写ajax

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery-2.1.1.min.js" ></script>
	
	</head>
	<body>
		<p>
			用户名:
			<input type="text" id="name" onblur="a1()"/>
			<span id="userInfo"></span>
		</p>
		<p>
			密码:
			<input type="text" id="pwd" onblur="a2()"/>
			<span id="pwdInfo"></span>
		</p>
		<script>
			function a1(){
				$.post({
					url:"http://localhost:8080/ajaxtest/login",
					data:{"name":$("#name").val()},
					success: function(data){
						if(data.toString()=='ok'){//信息核对成功
							$('#userInfo').css("color","green")
						}else{
							$('#userInfo').css("color","red")
						}
						$("#userInfo").html(data);
					}
				})
			}
			function a2(){
				$.post({
					url:"http://localhost:8080/ajaxtest/login",
					data:{"pwd":$("#pwd").val()},
					success: function(data){
						if(data.toString()=='ok'){//信息核对成功
							$('#pwdInfo').css("color","green")
						}else{
							$('#pwdInfo').css("color","red")
						}
						$("#pwdInfo").html(data);
					}
				})
			}
		</script>
	</body>
</html>

query三种基本的选择器
$(’#id’) $(‘标签名’) $(’.class’）
$()这个是指页面加载完之后要干的事，里面可以写函数，页面加载完就运行里面的函数了

ajax:

$.get({
url:接口的url
data:提交的数据 （里面是键值对的形式）
success：function(data){}   回调函数，里面的data是后端返回来的数据
})

js中的回调函数
定义：一个函数(sa)被当做了参数传给了另一个函数(x)，这个被当做参数的这个函数叫做回调函数。

		<script>
			function fa(x){
				console.log(x)
				x()
			}	
			
			function sa(){
				console.log("我是b1（）函数")
			}
			
			fa(sa);
		</script>

� 很皮很天真

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQuery中的ajax实现

JQuery中的ajax实现1.导入jquery包2.写ajax<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="js/jquery-2.1.1.min.js" ></script> </head> <body
复制链接

扫一扫

专栏目录