javaScript&ajax
2021-04-20 06:27
标签：form text submit win jquer key type window 奔驰 1、需要HTML标签转义后才可运行 javaScript&ajax 标签：form text submit win jquer key type window 奔驰 原文地址：https://www.cnblogs.com/tour8/p/13285687.html 1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>Title</title>
6 </head>
7 <body>
8 <!--1、写一个登录页面-->
9
10 <!--基本不用form发送请求-->
11 <!--<form action="http://api.nnzhp.cn/api/user/login" method="post">-->
12
13 <input type="text" name="username" id="username" value="niuhanyang">
14 <input type="password" name="password" id="password" value="aA123456">
15 <!--点击事件-->
16 <input type="button" value="登录" id="login" onclick="login()">
17
18 <!--<input type="submit" value="提交" onclick="login()">-->
19 <!--<input type="button" value="登录-ID" id="id1">-->
20
21 <!--</form>-->
22
23 <script src="jquery.js"></script>
24 <script>
25 function login() {
26 //获取 用户名和密码
27 var username = document.getElementById('username').value
28 var password = document.getElementById('password').value
29
30 console.log('username:'+username)
31 console.log('password:'+password)
32
33 //发请求
34 // ajax jquery(js dom封装了 变的更好用的包)
35 $.ajax({
36 url: 'http://api.nnzhp.cn/api/user/login',
37 method: 'post',
38 data: {
39 username: username,
40 passwd: password
41 },
42 //success 回调函数
43 success: function (response) {
44 if (response.error_code != 0) {
45 alert(response.msg)
46 }else {
47 //当登录成功，希望将sign userId 渲染到页面上
48 //createElement obj
49 //insertxxxHTML()
50
51 //1.获取sign userid
52 var sign = response.login_info.sign;
53 var user_id = response.login_info.userId;
54
55 //2.创建字符串标签
56 var sign_span = '<span style="display:block">sign:'+sign+'</span>'
57 var user_span = '<span style="display:block"> user:'+user_id+'</span>'
58
59 //3.渲染到页面上
60 var button = document.getElementById('login')
61 button.insertAdjacentHTML('afterEnd',sign_span+user_span)
62
63 console.log(response)
64
65 //window.location.href = 'http://www.baidu.com'
66 }
67 }
68
69 })
70
71 // console.log('username:'+username)
72 // console.log('password:'+password)
73 // alert('请求后台了')
74
75
76 //// 如果用户名 不是admin 抛出异常
77 //// if(username == 'admin' && password =='123456'){
78 //// if(username == 'admin' || password =='123456'){
79 //
80 //// == 不验证数据类型；===数据类型和值都验证
81 // if(username == 'admin'){
82 // console.log('username是admin')
83 // }else if(username == 'user'){
84 // console.log('username是user')
85 // }
86 // else{
87 // console.log('username不是admin')
88 // }
89
90
91 // switch (username){
92 // case 'admin':
93 // alert('admin')
94 // break;
95 // case 'user':
96 // alert('user')
97 // break;
98 // default:
99 // alert('default')
100 // }
101
102
103 // //循环 数组
104 // var tmp = ['宝马','奔驰','尼桑']
105 // for (num in tmp){
106 // console.log(tmp[num])
107 // }
108
109
110 // //循环 map
111 // var tmp = {'name':'BMW','age':18};
112 // for (key in tmp){
113 // console.log(tmp[key])
114 // }
115
116
117 // //循环
118 // var tmp = ['宝马','奔驰','尼桑']
119 // for(var i=0; i<tmp.length;i++){
120 // console.log(tmp[i])
121 // }
122 //
123
124 }
125
126
127 // var element = document.getElementById('id1');
128 // element.onclick = function () {
129 //// console.log('这里请求 后台了...element')
130 //// alert('请求后台了')
131 //
132 // var flag = confirm('你确认登录了？？')
133 // console.log(flag)
134 // }
135
136
137 // //普通函数
138 // function funcname(name,age) {
139 //
140 //
141 // }
142 // funcname('lzh',18);
143
144
145 // //匿名函数
146 // //函数即变量
147 // var funcNameTwo = function(){
148 //
149 // }
150 // funcNameTwo();
151
152 </script>
153 </body>
154 </html>
文章标题：javaScript&ajax
文章链接：http://soscw.com/index.php/essay/77006.html