Есть массив заранее подготовленных фраз, когда пользователь вводит что-то в input запускается обработчик keyup, который ищет в исходном массиве совпадения. Есть 2 фразы Привет и Приветствую массив перебираю циклом for(key in data), затем ищу совпадение пользовательского ввода в ячейках массива
inputVal = $.trim($(this).val()); // значение в инпуте
data[key].answer.indexOf(inputVal) != -1 // если нашел совпадение в массиве - вывожу его
НО сейчас выводится просто первое попавшееся совпадение, например если ввести привет , то как результат работы условия возвращается приветствую.
Как можно искать самое точное совпадение?) что-бы если ввели привет и такой ответ есть в массиве , то именно его я и получил в результате работы цикла/условия. Заранее спасибо!
P.S. фраз в массиве может быть рандомное число. При этом введенная фраза может браться не целая т.к. обработчик стоит на нажатие клавиши, например значение в инпуте может быть просто п или при или что угодно)
Можно выбирать наименьший из содержащих подстроку:
const input = document.getElementById('input');
const map = {
f1: {answer: 'Привет'},
f2: {answer: 'Приветствую'}
}
input.addEventListener('keyup', ev => {
const el = ev.target;
const val = el.value;
if (!val) return true;
const variants = Object.keys(map)
.map(k => map[k].answer) // получаем все ответы
.filter(v => v.indexOf(val) !== -1) // Выбираем только подходящие
.sort((a, b) => a.length - b.length); // сортируем по длине
if (variants.length && el.value !== variants[0]) {
el.value = variants[0]; // выбираем наименьший, если есть
}
});
<input id=input>
Если вам нужно найти только элемент в точности равный строке, то можно сравнивать значения на точное соответствие оператором == Вот так:
const p = [
{
id: 1,
data: 'приветик',
},
{
id: 1,
data: 'привет',
},
{
id: 1,
data: 'приветствую',
},
{
id: 1,
data: 'приветочек',
},
];
console.log(p.find(e=>e.data === 'привет'));
если искать надо все, что начинается с чего-то, то можно использовать регулярное выражения для сравнения начала строк. Вот так:
const p = [
{
id: 1,
data: 'приветик',
},
{
id: 1,
data: 'привет',
},
{
id: 1,
data: 'приветиком',
},
{
id: 1,
data: 'приветствую',
},
{
id: 1,
data: 'приветочек',
},
];
console.log(p.reduce((p,c)=>{
if(c.data.search(/^привети/) !== -1){
p.push(c);
}
return p;
}, []));
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости