Рендер результата работы цикла

267

02 ноября 2017, 08:30

Доброго времени суток, в input пользователь вводит вопросы, по событие keyup каждый раз запускается функция которая сравнивает совпадения в вводе пользователя и в объекте (ранее заготовленном). Объект перебирается циклом for(key in data) и если data[key].answer == вводу пользователя(хотя бы частично) то я вывожу поле из объекта в HTML.

Проблема в том что т.к. цикл запускается много раз, много раз находятся совпадения (одни и те же) и при рендере получается, что я вывожу вместо одного совпавшего ответа (например) Привет, штук 30... Как правильно отследить этот момент и рендерить только 1 совпавшее поле объекта в HTML? рендерится всё сюда

$('div.Answers').append('<p>' + data[key].answer + '</p>')

Заранее спасибо!

Answer 1

if ($('div.Answers p.' + key).length == 0) {
  $('div.Answers').append('<p class="' + key + '"></p>');
}
$('div.Answers p.' + key).text(data[key].answer);

а лучше

if ($('div.Answers p.[data-key="' + key + '"]').length == 0) {
  $('div.Answers').append('<p data-key="' + key + '"></p>');
}
$('div.Answers p.[data-key="' + key + '"]').text(data[key].answer);