Question

我试图硬编码一种登录系统，因为我试图有两个输入并点击检查这些值是否与数组中的值相匹配，该数组有两个对象可用于两个可能的答案...

好吧，我无法让它工作，所有的suden我的变量都无法识别，整体代码已经变成了kaput ......这里是Pen

提前感谢！

到目前为止的代码btw

$(".submit").click(function() {

//bidimensional array
var data = [{
    user: "cinco",
    pw: "king"
}, {
    user: "manco",
    pw: "wawa"
}];
var name = $(".name").val();
var pass = $(".pw").val();

if (data.user.includes(name) && data.pw.includes(pass)) {
    $(".check-input").addClass('valid');
} else {
    $(".check-input").addClass('invalid');
  }
});

$(".input").focus(function() {
  $(".check-input").removeClass("valid");
  $(".check-input").removeClass("invalid");
});

Answer 1

您可以像这样使用find()

if (data.find(v => v.user === name && v.pw === pass)) { ... }

请注意，使用javascript作为登录信息非常不安全，因为每个人都可以打开控制台并阅读凭据。

对于你的评论，=＆gt;是arrow function的一部分，归结为

if (data.find(function(v) { 
    return v.user === name && v.pw === pass; 
})) { ... }

Answer 2

var data = [{
    user: "cinco",
    pw: "king"
}, {
    user: "manco",
    pw: "wawa"
}];

checkLogin(usr, pwd){
  for(var index in data) {
    var obj = data[index];
    if(obj.user == usr && obj.pw == pwd) {
     return true;
    }
  }
  return false;
}

checkLogin('chino', 'wrongPwd'); // returns false
checkLogin('chino', 'king'); // returns true

Answer 3

您需要访问数组中的各个对象，并获取这些对象的user和pw属性。阵列本身没有这些属性。

这是一个可以简化代码的工作版本：

＆＃13;

$(".submit").click(function() {

	// This is not a bidimensional array. It's just an array of objects
	var data = [{
		user: "cinco",
		pw: "king"
	}, {
		user: "manco",
		pw: "wawa"
	}];
  
	var name = $(".name").val();
	var pass = $(".pw").val();

  // You need to access the individual objects in the array and get
  // the user and pw properties of those objects. The array itself
  // doesn't have those properties.
  
  // Loop through the array and check each object
  // You can't return from a forEach loop, so we'll set up a variable
  // that will be used after the loop is complete
  var valid = false;
  data.forEach(function(obj){
    // Don't check for inclusion of the data, check for exact match
  	if (obj.user === name && obj.pw === pass) {
	    valid = true;
	  } 
  });
  
  // Now that the loop is done, set the validity
  $(".check-input").addClass(valid ? 'valid' : 'invalid');
 
});

$(".input").focus(function() {
	$(".check-input").removeClass("valid");
	$(".check-input").removeClass("invalid");
});

＆＃13;

.check-input{
	width:250px;
	height:40px;
	background-color:gray;

}
.valid{
	background-color:green;
}

.invalid{
	background-color:crimson;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="input name">
<input type="text" class="input pw">
<button class="submit">Submit</button>
<div class="check-input"></div>

＆＃13;

在数组内的对象中搜索

3 个答案: