使用jquery的实现ajax异步请求

ajax请求

先引入jquery插件，网络引入地址：
百度：

<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>

又拍云：

<script src="https://upcdn.b0.upaiyun.com/libs/jquery/jquery-2.0.2.min.js">
</script>

新浪：

<script src="https://lib.sinaapp.com/js/jquery/2.0.2/jquery-2.0.2.min.js">
</script

1. get请求介绍
   
2. post请求
   

form表单代码片段

<form action="" method="">
<table>
<tr>
	<td>用户名</td>
	<td><input type="text" id="username"></td>
</tr>
<tr>
	<td>密码</td>
	<td><input type="password" id="password"></td>
</tr>
<tr>
	<td colspan="2"><input type="submit" value="登录" id="login"></td>
</tr>
</table>
</form>

每个输入框绑定id的原因是交给jquery监听并且进行操作

jquery代码

<script type="text/javascript">
	$(function () {
		$("#btn").click(function () {
			var name=$('#username').val();
			var password=$('#password').val();
			$.ajax({
				url:"login",
				data:{"name":name,"password":password},
				type:"post",
				dataType:"json",
				success:function(data){
					alert(data);
				}
			});
		});
	});
</script>

后台controller代码

@RequestMapping("/login")
	@ResponseBody
	public String login(String name,String password) {
		System.out.println(name);
		System.out.println(password);
		return "返回给前台展示";
	}

注意最好不要加contentType:“application/json;charset=UTF-8”,属性
可能导致后台接收到的数据为null