Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 12.06.2017, 21:54
Новичок на форуме
Отправить личное сообщение для Rishat1c Посмотреть профиль Найти все сообщения от Rishat1c
 
Регистрация: 12.06.2017
Сообщений: 3

Поиск по странице
Всем доброго дня, взял готовую поисковую систему написанную на jQuery ( линк: http://jsfiddle.net/6c3ph7uj/2/ ), проблема в том, что она ищет по тексту совпадение.

У меня имеется несколько input'ов в каждой из них хранится определенный текст, хотел реализовать чтобы поиск не по тексту искал, а среди всех инпатов на странице.

Вывод инпатов на странице
<table class="table company">
    				<tr>
    					<td><center><input type="submit" class="btn btn-info" value="V" ng-show="compForm.$dirty"/></center></td>
    					<td><input type="text" ng-model="company.Name"/></td>
    					<td><input type="text" ng-model="company.Object"/></td>
    					<td><input type="text" ng-model="company.Amount"/></td>
    					<td><input type="text" ng-model="company.Price"/></td>
    					<td><center><input type="button" class="btn btn-danger" value="X" ng-click="delete(company);"/></center></td>
    				</tr>
					</form>
    			</table>


Скрипт поиска:
var minlen = 3; // минимальная длина слова
 var paddingtop = 30; // отступ сверху при прокрутке
 var scrollspeed = 200; // время прокрутки
 var keyint = 1000; // интервал между нажатиями клавиш
 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-paddingtop}, scrollspeed); // переход к первому фрагменту
 });
 
 function dosearch() {
  term = jQuery('#spterm').val();
  jQuery('span.highlight').each(function(){ //удаляем старую подсветку
   jQuery(this).after(jQuery(this).html()).remove();  
  });
  var t = '';
  //jQuery('div#news_sub').each(function(){ // в селекторе задаем область поиска
  jQuery('input').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-paddingtop}, scrollspeed); // переход к следующему фрагменту
    });
    jQuery('span.highlight:last').attr({title: 'Нажмите, чтобы вернуться к форме поиска'}).click(function(){
     jQuery('body,html').animate({scrollTop: jQuery('#spterm').offset().top-paddingtop}, 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(); // переходим к первому фрагменту
 }


Будьте добры, помочь или подсказать в какой степи искать, в
пытался подменить div#content на input Надеялся, что сработает.
Заранее благодарю
Ответить с цитированием
  #2 (permalink)  
Старый 12.06.2017, 22:41
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

как планируете выделять часть текста в инпутах?
х.з. может кто сталкивался и подскажет, но лично я не знаю.
как альтернатива информацию из инпутов в блоки, а по ним искать.

<html>
<head>
	<meta charset="utf-8">
</head>
<body>
<input type="text" id="id">
<div id="block"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$('#id').keyup(function(){
	$("#block").html(this.value);
});
</script>
</body>
</html>
Ответить с цитированием
  #3 (permalink)  
Старый 12.06.2017, 23:08
Новичок на форуме
Отправить личное сообщение для Rishat1c Посмотреть профиль Найти все сообщения от Rishat1c
 
Регистрация: 12.06.2017
Сообщений: 3

Да мне хотя бы чтобы текст в input'ах выделял, а не сам инпат)
Ответить с цитированием
  #4 (permalink)  
Старый 12.06.2017, 23:09
Новичок на форуме
Отправить личное сообщение для Rishat1c Посмотреть профиль Найти все сообщения от Rishat1c
 
Регистрация: 12.06.2017
Сообщений: 3

Может есть у кого нибудь какие нибудь варианты? или получше идея)
Ответить с цитированием
  #5 (permalink)  
Старый 12.06.2017, 23:39
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

Сообщение от Rishat1c Посмотреть сообщение
Да мне хотя бы чтобы текст в input'ах выделял, а не сам инпат)
так вот я об этом и говорю, сам инпут выделить не проблема, а чем выделить нужный кусок value в нем я не знаю
Ответить с цитированием
  #6 (permalink)  
Старый 13.06.2017, 02:28
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от Rishat1c
Да мне хотя бы чтобы текст в input'ах выделял, а не сам инпат
Все находящееся в inpiut, это строка и как html не интерпретируется.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Плагин для Chrome работа с DOM поиск по странице lonedr Events/DOM/Window 11 12.05.2017 12:57
Поиск по 1 странице VasyaPetrov123 Общие вопросы Javascript 4 03.08.2015 21:53
НЕЖАДНЫЙ ПОИСК ID ПО СТРАНИЦЕ Brook Events/DOM/Window 5 25.11.2012 16:33
Поиск самого крупного шрифта на странице eXTrEMe888 Events/DOM/Window 11 03.05.2012 20:23
Поиск id на странице Suharik jQuery 2 27.10.2010 17:18