Перебор элементов массива и сравнение со значением
Доброго времени суток, есть небольшая функция которая должна искать совпадение с введенным значением в input и элементами массива, если совпадение есть должна появиться надпись true, если нет false.
Но true выводится только если в input введено (пять) - то-есть последнее значение массива, если же ввести (два) или (три) выводит false. Вопрос, почему так происходит, если значение (три) есть в массиве, и как сделать чтобы функция работала корректно?
function myFunc(){
let arr = ['один', 'два', 'три', 'четыре', 'пять'];
let input = document.getElementById('input').value; //получаем значение введенное в input
let out = document.getElementById('out');
for(let i = 0; i < arr.length; i++){
if(arr[i] == input){
out.innerHTML = 'true';
}
else{
out.innerHTML = 'false';
}
}
}
document.getElementById('enter').onclick = myFunc;
<input type="text" id="input"> <button id="enter">Click</button> <p id="out"></p> |
TheSanches,
одно из множества решений, в цикле вам нужно получить значение, а после цикла его установить |
После того как вы нашли совпадение, нужно останавливать цикл.
Вы можете отказаться от перебора массива и воспользоваться методом "indexOf":
document.getElementById('enter').onclick=function(){
document.getElementById('out').innerHTMl=
['один', 'два', 'три', 'четыре', 'пять'].indexOf(
document.getElementById('input').value.toLowerCase()
)>-1;
};
https://developer.mozilla.org/ru/doc.../Array/indexOf |
Спасибо
|
TheSanches,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script>
"use strict"
window.addEventListener('DOMContentLoaded', function() {
function myFunc(){
let arr = ['один', 'два', 'три', 'четыре', 'пять'];
let input = document.getElementById('input').value; //получаем значение введенное в input
let out = document.getElementById('out');
let assessment = false;
for(let i = 0; i < arr.length; i++){
if(arr[i] == input){
assessment = true; break;
}
}
out.innerHTML = assessment
}
document.getElementById('enter').addEventListener('click', myFunc);
});
</script>
</head>
<body>
<input type="text" id="input" value="три">
<button id="enter">Click</button>
<p id="out"></p>
</body>
</html>
|
Можно и не останавливать - полная проверка. В массиве могут быть повторы
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script>
"use strict"
window.addEventListener('DOMContentLoaded', function() {
function myFunc(){
let arr = ['один', 'два', 'три', 'четыре', 'пять'];
let input = document.getElementById('input').value; //получаем значение введенное в input
let out = document.getElementById('out');
let assessment = '';
for(let i = 0; i < arr.length; i++){
assessment += arr[i] + ':' + (arr[i] == input) + '<br>';
}
out.innerHTML = assessment
}
document.getElementById('enter').addEventListener('click', myFunc);
});
</script>
</head>
<body>
<input type="text" id="input" value="три">
<button id="enter">Click</button>
<p id="out"></p>
</body>
</html>
|
рони,
for(let i = 0; i < arr.length; i++){
if(arr[i] == input){
assessment = true; break;
}
}
вместо этого куска так и напрашивается .some() |
Цитата:
|
| Часовой пояс GMT +3, время: 11:03. |