Как сделать активацию не при клике а сразу после ввода?

Question

[Юрий Витальевич]

Есть поиск по словам. Набираешь слово и он показывает сколько есть таких слов и кнопка перейти. Не могу разобраться как убрать эту кнопку перейти и сделать так, чтобы когда набрал слово и если оно есть был бы сразу скролл до этого слова и без нажатия на кнопку. Пытался разобраться, не получилось, пробовал SetInterval поставить, не силен я в JS, помогите люди добрые))

Вот js:

jQuery(document).ready(function(){
 var minlen = 3; // минимальная длина слова
 var paddingbottom = 500; // отступ сверху при прокрутке
 var scrollspeed = 200; // время прокрутки
 var keyint = 0; // интервал между нажатиями клавиш
 var term = '';
 var n = 0;
 var time_keyup = 0;
 var time_search = 0;

 jQuery('body').delegate('#spgo', 'click', function(){
  jQuery('body,html').animate({scrollTop: jQuery('span.highlight:first').offset().top-paddingbottom}, scrollspeed); // переход к первому фрагменту
 });
 
 function dosearch() {
  term = jQuery('#spterm').val();
  jQuery('span.highlight').each(function(){ //удаляем старую подсветку
   jQuery(this).after(jQuery(this).html()).remove();  
  });
  var t = '';
  jQuery('div#conten').each(function(){ // в селекторе задаем область поиска
   jQuery(this).html(jQuery(this).html().replace(new RegExp(term, 'ig'), '<span class="highlight">$&</span>')); // выделяем найденные фрагменты
   n = jQuery('span.highlight').length; // количество найденных фрагментов
   console.log('n = '+n);
   if (n==0)
    jQuery('#spresult').html('Ничего не найдено');
   else
    jQuery('#spresult').html('Найдено: '+n+'. <span class="splink" id="spgo">Перейти</span>'); 
   if (n>1) // если больше одного фрагмента, то добавляем переход между ними
   {
    var i = 0;
    jQuery('span.highlight').each(function(i){
     jQuery(this).attr('n', i++); // нумеруем фрагменты, более простого способа искать следующий элемент не нашел
    });
    jQuery('span.highlight').not(':last').attr({title: 'Нажмите, чтобы перейти к следующему фрагменту'}).click(function(){ // всем фрагментам, кроме последнего, добавляем подсказку
     jQuery('body,html').animate({scrollTop: jQuery('span.highlight:gt('+jQuery(this).attr('n')+'):first').offset().top-paddingbottom}, scrollspeed); // переход к следующему фрагменту
    });
    jQuery('span.highlight:last').attr({title: 'Нажмите, чтобы вернуться к форме поиска'}).click(function(){
     jQuery('body,html').animate({scrollTop: jQuery('#spterm').offset().top-paddingbottom}, scrollspeed); // переход к форме поиска
    });
   } 
  });
 }

 jQuery('#spterm').keyup(function(){
  var d1 = new Date();
  time_keyup = d1.getTime();
  if (jQuery('#spterm').val()!=term) // проверяем, изменилась ли строка
   if (jQuery('#spterm').val().length>=minlen) { // проверяем длину строки
    setTimeout(function(){ // ждем следующего нажатия
     var d2 = new Date();
     time_search = d2.getTime();
     if (time_search-time_keyup>=keyint) // проверяем интервал между нажатиями
      dosearch(); // если все в порядке, приступаем к поиску
    }, keyint); 
   }
   else
    jQuery('#spresult').html('&nbsp'); // если строка короткая, убираем текст из DIVа с результатом 
 });	
 
 if (window.location.hash!="") // бонус
 {
  var t = window.location.hash.substr(1, 50); // вырезаем текст
  jQuery('#spterm').val(t).keyup(); // вставляем его в форму поиска
  jQuery('#spgo').click(); // переходим к первому фрагменту
 } 
});

И  html :

<input id="spterm" type="search" name="spterm" placeholder="Поиск..."><br />
<div id="spresult">&nbsp;</div>

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

Comments

[zkrvndm]

Дай ссылку на сайт с поиском, возможно смогу помочь.

Answer 1

[Юрий Витальевич]

Andriy Kosmenyuk я обязательно прочту, но я бы не стал писать здесь, если бы мог сейчас заняться изучением асинхрона. Думал, мб исправит кто нибудь, у самого нет возможности сейчас, потому что в дороге, а нужно срочно исправлять((

Comments

[When you dont want to litter on stackoverflow]

Ну если нужно сделать всё быстро, то прочитай только про промисы и про async, await. Потратишь максимум пол чеса. Но можно и за 15 мин, так что....

[Юрий Витальевич]

Andriy Kosmenyuk нет возможности помочь с кодом, я не пойму сейчас ничего, и ноута рядом нет, мне исправить этот код и отправить, кодить нет возможности?

[When you dont want to litter on stackoverflow]

Юрий Витальевич, Простите, но я не могу ничем помочь, поскольку у меня нет сейчас времени на это. Можешь поискать готовые решение в интернете, думаю что что-то найдёшь. Та и вообще писать полное решение к подобной задачи на habr никто не будет.

[Юрий Витальевич]

Andriy Kosmenyuk, ну ладно, все равно спасибо!)

[When you dont want to litter on stackoverflow]

Юрий Витальевич, Вот нашел решение для php с применением обёртки AJAX https://javascript.ru/forum/dom-window/65687-zhivo... . Смотрел только один глазком, поскольку как и писал, я сейчас занят.

[Юрий Витальевич]

Andriy Kosmenyuk, Спасибо, но мне нужно просто сделать, чтобы человек не нажимал кнопку чтобы перейти к тому, что он ищет, а чтобы после проверки сразу происходил скролл

[When you dont want to litter on stackoverflow]

Юрий Витальевич, Ладно, я понял. Вообще если есть возможность то откажись от задачи, если ты в дороге, и не можешь её нормально сев и подумав её сделать. Если нет то, ёщи в интернете решения.