| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>Title</title>
- <script src="js/jquery-2.1.4.js"></script>
- </head>
- <body>
- <form action="#" >
- 账号: <input type="text" name="username" id="username"><br>
- 密码: <input type="password" name="password" id="password"><br>
- <input type="button" value="登录" onclick="get()">
- </form>
- <button onclick="get()">get</button>
- </body>
- <script>
- function get(){
- // 使用jquery 发送异步请求
- /**
- * $: 表示jquery 对象
- * $.get() 调用jquery 的对象额函数
- * get(url: 请求路径,data: 请求参数,callback: function(result){
- * 这个回调函数当中result 就是后端给前端返回的数据
- * jquery 发送请求有一个优点, 后端如果给前端返回json 数据
- * result-> json -> js 对象 他会帮我们把json 转成js 对象
- * 回调函数, 当后端处理成功就会毁掉这个callback
- * }))
- */
- /**
- * get方法请求参数 可以直接在路径当中写
- *
- * 路劲: 协议://ip:port/请求路径?请求参数名=请求参数值&请求参数名=请求参数值
- */
- var username = document.getElementById("username").value
- var password = document.getElementById("password").value
- $.get("http://c46a5489.natappfree.cc/login",{username:username,password:password},function (result) {
- // result 后端给前端返回的数据一般是json 的数据格式
- console.log(result);
- if(result.success){
- alert("登录成功")
- }else{
- alert("登录失败")
- }
- })
- /**
- * 提供一个登录界面
- * 发送一个get 请求把账号和密码发送请求携带到后端
- *
- */
- }
- </script>
- </html>
|
