Chrome ajax 执行后, 会再执行一次获取 login.html 的操作. Firefox ajax 直接就不触发,这段代码哪里出现了问题?
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>Document</title> <script src="jquery.min.js"></script> </head> <body> <form> 用户名: <input type="text" id="username" /><br /> 密码: <input type="password" id="password" /><br /> <button id="login">登录</button> <button id="reg">注册</button> </form> <script> var username = $("#username").val(); var password = $("#password").val(); $("#login").click(function() { $.ajax({ url: "/login", data: { username: $("#username").val(), password: $("#password").val() }, dataType: "json", success(res) { if (res.err) { alert(res.msg); } else { alert("登录成功"); } } }); }); </script> </body></html>
const http = require("http");const url = require("url");const querystring = require("querystring");const fs = require("fs");let user = { admin: 123456};http .createServer((req, res) => { let path, get, post; if (req.method == "GET") { let { pathname, query } = url.parse(req.url, true); path = pathname; get = query; } else if (req.method == "POST") { let arr = []; req.on("data", buffer => { arr.push(buffer); }); req.on("end", () => { post = querystring.parse(Buffer.concat(arr).toString()); }); } complete(); function complete() { if (path == "/login") { res.writeHead(200, { "Content-Type": "text/plain;charset=utf-8" }); let { username, password } = get; if (!user[username]) { res.end( JSON.stringify({ err: 1, msg: "用户名不存在" }) ); } else if (user[username] != password) { res.end( JSON.stringify({ err: 2, msg: "密码错误" }) ); } else { res.end( JSON.stringify({ err: 0, msg: "登录成功" }) ); } } else if (path == "/reg") { res.writeHead(200, { "Content-Type": "text/plain;charset=utf-8" }); let { username, password } = post; if (user[username]) { res.end( JSON.stringify({ err: 1, msg: "账户已经存在" }) ); } else { res.end( JSON.stringify({ err: 0, msg: "注册成功" }) ); } } else { fs.readFile(`www${path}`, (err, data) => { if (err) { res.end("404 not found"); } else { res.end(data); } }); } } }) .listen(8080);
目录结构:
www
jquery.min.js
login.html
index.js
地址栏输入: localhost:8080/login.html这时候是正常的
然后输入账户密码, 点击登录, chrome 会出现登录成功或者登录失败的提示框,这时候也是正常的。
问题在于点击这个提示框的确定之后,发生的事情稍微有一点诡异,就是login.html会自动重新请求加载一次,然后地址栏网址变为localhost:8080/login.html?, 多出来一个问号。
我看老师演示的时候并不是这样的,我的代码是哪里出现了问题呢,找了半天也没找到。
我的问题:
为什么 chrome 在执行完 ajax 后会重新加载一次 login.html 呢?
然后地址栏为什么会多出个 ? 呢?
火狐为啥和Chrome表现的不一致呢?(没执行ajax里的GET请求,重新加载完也没多出一个 ?号)
我怀疑是我 js 哪里写的有点问题,但是真的看不出来啊...