jQuery发送数据的3种方式

最新推荐文章于 2024-08-09 02:16:38 发布

佐木宥轩

最新推荐文章于 2024-08-09 02:16:38 发布

阅读量3.7k

点赞数

分类专栏： jQuery

本文链接：https://blog.csdn.net/moli8314/article/details/79686880

版权

jQuery 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

<script src="/js/jquery-1.11.3.js"  ></script>
<script>
    // 采用get方式发送数据
	function jq_get(){
		//$.get("/demo","username=zs&password=123",function(obj){
		var params = {
				"username":"zhangsan",
				"password":"123"
		}
		$.get("/demo",params,function(obj){
			console.log(obj);
		},"json");
	}
	//采用post方式发送
	function jq_post(){
		var params={"username":"zhangsan","password":"1234"}
		$.post("/demo",params,function(obj){
			console.log(obj);	
		},"json");			
	}
	
	//采用ajax配置参数的方式发送
	function jq_ajax(){
		$.ajax({
			"url":"/demo",
			"type":"post",
			"data":{"username":"lisi","password":"12345"},
			"success":function(obj){ console.log(obj)},
			"error":function(obj){console.log(obj)},
			"dataType":"json",
			"async":true
		});
	}
</script>

创建数据库和表
创建一个项目
1. 导入jar包
2. 导入配置文件
3. 导入工具类
4. 导入jquery.js
给表单中的文本框添加失去焦点事件
1. 将用户输入的内容通过ajax发送给servlet
servlet
1. 接受用户的参数
2. 调用Service完成查询操作 count(*) 返回值:int
3. 判断int是否为0
  1. 若为0, 代表用户名可以使用,给浏览器返回值1
  2. 如果不为0, 代表用户名已被占用,给浏览器返回0
编写service,dao
在页面回调函数中判断返回值即可

<body>
	用户名:<input type="text" name="username" id="username" /><span id="span1"></span>
	<script>
		$("#username").blur(function(){
			//当光标移出的时候,需要去调用查找用户名
			var value = $(this).val();
			//将用户输入的内容发送给后台去校验
			$.get("/day23/check","username="+value,function(obj){
				//判断结果
				if(obj=="1"){ //代表可用
					$("#span1").html("恭喜您,用户名可用");
				}else{
					$("#span1").html("用户名已经存在");
				}
			});
		});
	</script>
</body>