Есть массив заранее подготовленных фраз, когда пользователь вводит что-то в 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;
}, []));
Современные решения для бизнеса: как облачные и виртуальные технологии меняют рынок
Виртуальный выделенный сервер (VDS) становится отличным выбором
Нужно чтобы, когда collapsible-header становился active, в class="material-icons" текст заменялся на keyboard_arrow_down, соответственно другой в то же время когда становился...
Я пытаюсь убрать подчеркивания у ссылок, но css работает только, если убрать строку с подключением bootstrap (ссылка: https://maxcdnbootstrapcdn