登录账户JQ-ajax

 1 针对于form表单：
 2 <!doctype html>
 3 <html lang="en">
 4 <head>
 5     <meta charset="UTF-8">
 6     <title>Document</title>
 7 </head>
 8 <body>
 9     <form action="">
10         姓名<input type="text" value="" id="" name="user"><br>
11         密码:<input type="password" value="" id="" name="pass"><br>
12         <select name="sex" id="">
13             <option value="nv">女</option>
14             <option value="nan">男</option>
15         </select>
16         <button>提交</button>
17     </form>
18     <script src="jquery-1.8.3.min.js"></script>
19     <script>
20     $(function() {
21         $('button').click(function() {//只适合form表单
22             $.ajax({
23                 type:"get",
24                 url:"act1.php",
25                 data:$("form").serialize(),
26                 dataType:"json",
27                 success:function(data) {
28                     alert(data.msg);
29                 },
30             });
31         })
32     })
33     </script>
34 </body>
35 </html>

 1 get方式：
 2 <!doctype html>
 3 <html lang="en">
 4 <head>
 5     <meta charset="UTF-8">
 6     <title>Document</title>
 7 </head>
 8 <body>
 9     登录：<input type="text" value="" id="inp1"><br>
10     密码：<input type="password" value="" id="inp2">
11     <button>登录</button>
12 
13     <script src="jquery-1.8.3.min.js"></script>
14     <script>
15     $(function() {
16         $('button').click(function() {//get方式的ajax,参数顺序不能变
17             $.get('act.php',{"user":$('#inp1').val(),"pass":$('#inp2').val()},function(data) {
18                 alert(data.msg);
19             },'json');
20         })
21     })
22     </script>
23 </body>
24 </html>

ajax通用方式：

 1 <!doctype html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8     登录：<input type="text" value="" id="inp1"><br>
 9     密码：<input type="password" value="" id="inp2">
10     <button>登录</button>
11     <script src="jquery-1.8.3.min.js"></script>
12     <script>
13     $('button').eq(0).click(function() {
14         $.ajax({
15             type:'get',//类型为get或者post，取决于后台
16             url:'act.php',
17             data:{"user":$('#inp1').val(),"pass":$('#inp2').val()},
18             cache:false,//不读取缓存,和随机数，时间戳的作用一样
19             async:true,//默认的是异步加载，可以不写
20             dataType:"json",//返回的数据类型
21             success:function(data) {//请求冲成功的回调函数，请求的数据 作为参数传过来
22                 console.log(typeof(data));//json
23                 console.log(data);
24                 alert(data.msg);
25             },
26             /*error:function() {//请求失败的函数，可以没有
27                 alert('请求失败');
28             },
29             complete:function() {//请求成功与失败都会执行，可以不写
30                 alert('请求完成')
31             }*/
32         })                                
33     })
34     </script>
35 </body>
36 </html>