_11_axios_ajax.html 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. <script src="js/axios.min.js"></script>
  7. </head>
  8. <body>
  9. <form action="#" >
  10. 账号: <input type="text" name="username" id="username"><br>
  11. 密码: <input type="password" name="password" id="password"><br>
  12. <input type="button" value="登录" onclick="get()">
  13. </form>
  14. <button onclick="get()">get</button>
  15. <button onclick="post()">post</button>
  16. </body>
  17. <script>
  18. /**
  19. * http://c46a5489.natappfree.cc/login
  20. * 需求: 使用get 请求调用/login 接口
  21. * 使用post 调用/login1 接口
  22. */
  23. function get(){
  24. var username = document.getElementById("username").value
  25. var password = document.getElementById("password").value
  26. axios({
  27. method: "get",
  28. url: "http://c46a5489.natappfree.cc/login",
  29. params: {"username":username,"password":password}
  30. }).then(function (result) {
  31. if(result.data.success){
  32. alert("登录成功")
  33. }else{
  34. alert("登录失败")
  35. }
  36. })
  37. }
  38. function post(){
  39. var username = document.getElementById("username").value
  40. var password = document.getElementById("password").value
  41. axios({
  42. method: "post",
  43. url: "http://c46a5489.natappfree.cc/login1",
  44. data: {"username":username,"password":password}
  45. }).then(function (result) {
  46. if(result.data.success){
  47. alert("登录成功")
  48. }else{
  49. alert("登录失败")
  50. }
  51. })
  52. }
  53. </script>
  54. </html>