我在 JSON 文件中有两组数据:
Admins = [{"Admin":"jhonmorris"},{"Admin":"clarkechris"}]
UIDS = [{"password":"Jhon", "username":"jhonmorris"}, {"password":"Jean", "username":"jeanheadly"}, {"password":"Clarke", "username":"clarkechris"}]
我有一个 HTML，用户登录页面为:
<html>
<head>
<script type="text/javascript" src="data.json" ></script>
<script type="text/javascript" src="checking.js" ></script>
</head>
<body>
<form name="myForm" method="post">
UserName<input type="text" id="uid" value="uid"/>
UserPassword<input type="password" id="pwd" value="pwd"/>
<input type="submit" value="Submit" onclick="fnCheck()"/>
</form>
</body>
</html>
我有两种类型的用户，一种是admin(Adminsin JSON)，另一种是普通用户(JSON 中除 Admins 之外的任何其他用户用户名)。单击提交按钮时，我想获取在 var x 中输入的用户 ID，并从 中的 UIDS 检查它是否具有与其对应的正确密码>JSON。此外，我想检查相同的用户名是否属于 JSON 中的 Admins 数据集。如果是，我想将他重定向到谷歌。如果没有，我想将他重定向到雅虎。
我正在使用 JavaScript 读取 JSON 数据，如下所示:
function fnCheck(){
alert("in fnCheck()");
if(checkUP() == true){
alert("checkUP returned true! UserID and Password are correct");
if(checkAdmin() == true){
alert("checkAdmin() returned true! going to admin page now");
window.location = 'http://www.google.com';
}
else if(checkAdmin() == false){
alert("checkAdmin() returned false! going to userIndex page now");
window.location = 'http://www.yahoo.com';
}
}
else{
alert("checkUP() returned false. Creds are Invalid!");
}
}
function checkAdmin(){
alert("in checkAdmin()");
//var adminJSON = JSON.parse(Admins);
//length = adminJSON.length;
x = document.forms["myForm"]["uid"].value;
for(var key in Admins){
var admin = Admins[key]
//alert(""+admin.Admin)
if(admin.Admin == x){
alert("Admin match found. Returning true!");
return true;
}
else{
alert("Admin match not found. Returning false");
return false;
}
}
}
function checkUP(){
alert("hello!!");
var x = document.forms["myForm"]["uid"].value;
var y = document.forms["myForm"]["pwd"].value;
alert("In checkUP, value of x = "+x+" calue of y = "+y);
for(var key in UP){
var user = UP[key]
//if(user.username == x && user.password == y){
if(x.match(user.username) && x.match(user.password)){
alert("user.username = "+user.username+"user.password = "+user.password+" User Id and password matched. Returning true now");
//alert("Matching "+x+ "with "+user.username"+ and "+y+" with user.password"+ y);
//break;
return true;
}
else{
//alert("User ID and password did not match. Returning false now. user.username = "+user.username+" user.password = "+user.password);
//break;
return false;
}
}
}
我尝试发出警报以找出所有地方出了什么问题，但我仍然无法弄清楚出了什么问题。非常感谢您的帮助!
最佳答案
这里没有调用你的函数，不要使用提交按钮的onclick事件，最好使用onsubmit="fnCheck"形式的:onsubmit事件()”
<form name="myForm" method="post" onsubmit="fnCheck(event)">
注意:
在 JSON 中存储密码是一种非常糟糕的做法，它会使您的页面非常脆弱且不安全。
给定的文件没有提供有效的 JSON 结构，这些只是 JavaScript 对象，假设你有一个有效的 JSON，使用
JSON.parse(json)来解析你的 json对象/数组。- 您的函数中存在一些错误，例如使用
undefined变量，例如UP的情况。 - 这是一个演示，您可以在其中测试您的函数是否使用
onsubmit正确调用，但您仍然需要删除/更正undefined变量。
var Admins = [{
"Admin": "jhonmorris"
}, {
"Admin": "clarkechris"
}];
UIDS = [{
"password": "Jhon",
"username": "jhonmorris"
}, {
"password": "Jean",
"username": "jeanheadly"
}, {
"password": "Clarke",
"username": "clarkechris"
}];
function fnCheck(e) {
e.preventDefault();
console.log("in fnCheck()");
if (checkUP() == true) {
console.log("checkUP returned true! UserID and Password are correct");
if (checkAdmin() == true) {
alert("checkAdmin() returned true! going to admin page now");
window.location = 'http://www.google.com';
} else if (checkAdmin() == false) {
alert("checkAdmin() returned false! going to userIndex page now");
window.location = 'http://www.yahoo.com';
}
} else {
alert("checkUP() returned false. Creds are Invalid!");
}
}
function checkAdmin() {
alert("in checkAdmin()");
//var adminJSON = JSON.parse(Admins);
//length = adminJSON.length;
x = document.forms["myForm"]["uid"].value;
for (var key in Admins) {
var admin = Admins[key]
//alert(""+admin.Admin)
if (admin.Admin == x) {
console.log("Admin match found. Returning true!");
return true;
} else {
console.log("Admin match not found. Returning false");
return false;
}
}
}
function checkUP() {
console.log("hello!!");
var x = document.forms["myForm"]["uid"].value;
var y = document.forms["myForm"]["pwd"].value;
console.log("In checkUP, value of x = " + x + " calue of y = " + y);
for (var key in UP) {
var user = UP[key]
//if(user.username == x && user.password == y){
if (x.match(user.username) && x.match(user.password)) {
console.log("user.username = " + user.username + "user.password = " + user.password + " User Id and password matched. Returning true now");
return true;
} else {
return false;
}
}
}<form name="myForm" method="post" onsubmit="fnCheck(event)">
UserName
<input type="text" id="uid" value="uid" />UserPassword
<input type="password" id="pwd" value="pwd" />
<input type="submit" value="Submit" />
</form>编辑:
在您的函数中，您在 if 语句中返回 true/false，因此它将始终在第一次迭代中离开该函数。
您应该使用 bool 标志并在 if 语句中相应地更改其值，并仅在函数末尾返回它:
function checkUP() {
console.log("hello!!");
var bool = false;
var x = document.forms["myForm"]["uid"].value;
var y = document.forms["myForm"]["pwd"].value;
console.log("In checkUP, value of x = " + x + " calue of y = " + y);
for (var key in UP) {
var user = UP[key]
if (x === user.username && y === user.password) {
console.log("user.username = " + user.username + "user.password = " + user.password + " User Id and password matched. Returning true now");
return true;
}
}
return bool;
}
关于javascript - 如何读取 JSON 数据并将其与变量进行比较，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31693758/