我想创建一个基本的搜索引擎,以名字和姓氏搜索对象数组中已经存在的学生,如果找到以这种方式命名的学生,则在页面上进行录入,如果没有写该页面不存在。但是当我有2个名字相同的人时,它同时给了我if语句的结果。有人可以帮忙吗
searchButton.addEventListener("click", function () {
userSearch = searchInput.value;
for (i = 0; i < allStudents.length; i++) {
student = allStudents[i];
if(userSearch.toLowerCase() === student.firstName.toLowerCase() ||
userSearch.toLowerCase() === student.lastName.toLowerCase() ||
userSearch.toLowerCase() === student.firstName.toLowerCase() + " " + student.lastName.toLowerCase() ||
userSearch.toLowerCase() === student.lastName.toLowerCase() + " " + student.firstName.toLowerCase()) {
outputDiv.innerHTML += "<h2> Student: " + student.firstName + " " + student.lastName + "</h2><br>" +
"Age: " + student.age + "<br>" +
"Eye Color: " + student.eyeColor + "<br>" +
"Hair Color: " + student.hairColor + "<br>" +
"Programming Skills: " + student.programmingSkills
searchInput.value = "";
} else {
searchInput.value = "";
outputDiv.innerHTML += "<h2>The student you searched for is not in out database</h2>"
}
}
});
答案 0 :(得分:0)
您可能要更改逻辑,因为有两项任务:
student
是否存在student
(如果可用),否则显示消息您可以使用变量(found
来跟踪是否在student
中找到了任何allStudents
,这样您就不必担心{{1 }}条件执行一次以上
else
let allStudents = [{
firstName: "George",
lastName: "A"
}, {
firstName: "George",
lastName: "B"
}]
searchButton.addEventListener("click", function() {
outputDiv.innerHTML = "";
userSearch = searchInput.value;
var found = false;
for (i = 0; i < allStudents.length; i++) {
student = allStudents[i];
if (userSearch.toLowerCase() === student.firstName.toLowerCase() ||
userSearch.toLowerCase() === student.lastName.toLowerCase() ||
userSearch.toLowerCase() === student.firstName.toLowerCase() + " " + student.lastName.toLowerCase() ||
userSearch.toLowerCase() === student.lastName.toLowerCase() + " " + student.firstName.toLowerCase()) {
outputDiv.innerHTML += "<h2> Student: " + student.firstName + " " + student.lastName + "</h2><br>" +
"Age: " + student.age + "<br>" +
"Eye Color: " + student.eyeColor + "<br>" +
"Hair Color: " + student.hairColor + "<br>" +
"Programming Skills: " + student.programmingSkills
found = true;
}
}
if (!found)
outputDiv.innerHTML = "<h2>The student you searched for is not in out database</h2>";
searchInput.value = "";
});
答案 1 :(得分:0)
您需要重新排列检查以查看是否找到它。您正在学生循环中输出“在我们的数据库中未找到该学生”,因此即使找到了另一个结果(在循环中),它也会输出该文本。我已通过将检查(如果找到了学生)移出循环并使用变量来跟踪该问题,从而纠正了该问题。我还做了一些更改,以便您不必在每个循环中都将名称重新格式化为LowerCase()或不必定位DOM元素。
searchInput = document.getElementById("search_text"),
searchButton = document.getElementById("SearchButton"),
outputDiv = document.getElementById("outputdiv");
searchButton.addEventListener("click", function () {
var userFound = false;
userSearch = searchInput.value;
studentLen = allStudents.length;
outputDiv.innerHTML = "";
for (i = 0; i < studentLen; i++) {
student = allStudents[i];
userSearch = userSearch.toLowerCase();
var fn = student.firstName.toLowerCase(),
ln = student.lastName.toLowerCase();
if(userSearch === fn || userSearch === ln || userSearch === fn + " " + ln || userSearch === ln + " " + fn) {
outputDiv.innerHTML += "<h2> Student: " + student.firstName + " " + student.lastName + "</h2><br>" +
"Age: " + student.age + "<br>" +
"Eye Color: " + student.eyeColor + "<br>" +
"Hair Color: " + student.hairColor + "<br>" +
"Programming Skills: " + student.programmingSkills
searchInput.value = "";
userFound = true;
}
}
if(!userFound){
outputDiv.innerHTML += "<h2>The student you searched for is not in out database</h2>";
}
});
使用HTML / JS进行小提琴演奏都包括: https://jsfiddle.net/Ltkacgn4/