Поиск нужных слов на веб-странице: небольшая недоработка

@Lara Semenova · Регистрация: 17.08.2017

Студворк — интернет-сервис помощи студентам

Здравствуйте, у меня есть функция поиска вводимых в инпут слов с помощью джаваскрипта на странице, код которой я просто взяла с одного сайта. Однако, оказалось, что там есть проблема: код работает, но при вводе другого регистра слова сайт сначала сообщает о несуществовании этого слова, а потом находит его. Как это можно решить? Просто я в JavaScript ну реально чайник.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<script type="text/javascript">
var lastResFind=""; // последний удачный результат          http://adatum.ru/poisk-i-vy-delenie-na-html-stranitse.html
var copy_page=""; // копия страницы в ихсодном виде
function TrimStr(s) {
     s = s.replace( /^\s+/g, '');
  return s.replace( /\s+$/g, '');
}
function FindOnPage(inputId) {//ищет текст на странице, в параметр передается ID поля для ввода
  var obj = window.document.getElementById(inputId);
  var textToFind;
  
  if (obj) {
    textToFind = TrimStr(obj.value);//обрезаем пробелы
  } else {
    alert("Введенная фраза не найдена");
    return;
  }
  if (textToFind == "") {
    alert("Вы ничего не ввели");
    return;
  }
   
  if(document.body.innerHTML.indexOf(textToFind)=="-1")
  alert("Ничего не найдено, проверьте правильность ввода!");
   
  if(copy_page.length>0)
        document.body.innerHTML=copy_page;
  else copy_page=document.body.innerHTML;
 
   
  document.body.innerHTML = document.body.innerHTML.replace(eval("/name="+lastResFind+"/gi")," ");//стираем предыдущие якори для скрола
  document.body.innerHTML = document.body.innerHTML.replace(eval("/"+textToFind+"/gi"),"<a name="+textToFind+" style='background: gold'>"+textToFind+"</a>"); //Заменяем найденный текст ссылками с якорем;
  lastResFind=textToFind; // сохраняем фразу для поиска, чтобы в дальнейшем по ней стереть все ссылки
  window.location = '#'+textToFind;//перемещаем скрол к последнему найденному совпадению
 } 
</script>

HTML5
1
2
3
4
                             <form class="search">
                              <input type="text" id="text-to-find" placeholder="Найти учебный материал..." required>
                              <input type="image"  onclick="javascript: FindOnPage('text-to-find'); return false;" src="images/search.png"  title="Search">
                             </form>

@atanov · 12.01.2018, 07:21

В регулярках попробуйте добавить ещё один флаг, конец будет так: /gi

Да, и eval использовать не очень хорошо

@Lara Semenova · 15.01.2018, 12:32 **[ТС]**

Спасибо, но не могли бы вы более подробно расписать куда нужно это дописать? Я очень мало знаю о Дж-С, но применеие требуется уже сейчас

@atanov · 15.01.2018, 14:20

В 6-й строке попробуйте:

JavaScript
1
return s.replace( /\s+$/gi, '');

И такой же ключ в 5-й

@Lara Semenova · 15.01.2018, 18:43 **[ТС]**

ничего не изменилось

@atanov · 15.01.2018, 19:50

Забавный у Вас код.
Он ищет на странице слово, которое ввел пользователь, далее меняет это слово на тег <a>:

HTML5
1
с name="введённое слово" style="background: gold">введённое слово</a>

Если ввести например "Здравствуйте", то скрипт находит правильно.
Вопрос, что же доложен делать Ваш скрипт?

Вот здесь я немного поэксперементировал:

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<head <charset = "UTF-8"></head>
<form class="search">
<input type="text" id="text-to-find" placeholder="Найти учебный материал..." required>
<input type="image"  onclick="FindOnPage('text-to-find'); return false"; src="https://www.cyberforum.ru/images/search.png"  title="Search">
</form>
Здравствуйте, у меня есть функция поиска вводимых в инпут слов с помощью джаваскрипта на странице, код которой я просто 
взяла с одного сайта. Однако, оказалось, что там есть проблема: код работает, но при вводе другого регистра слова сайт 
сначала сообщает о несуществовании этого слова, а потом находит его. Как это можно решить? Просто я в JavaScript ну реально 
чайник.
<script>
var lastResFind=""; // последний удачный результат          http://adatum.ru/poisk-i-vy-delenie-na-html-stranitse.html
var copy_page=""; // копия страницы в ихсодном виде
function TrimStr(s) {
     s = s.replace( /^\s+/gi, '');
     return s.replace( /\s+$/gi, '');
}
function FindOnPage(inputId) {//ищет текст на странице, в параметр передается ID поля для ввода
  var obj = window.document.getElementById(inputId);
  var textToFind;
  
  if (obj) {
    textToFind = TrimStr(obj.value);//обрезаем пробелы
  } else {
    alert("Введенная фраза не найдена");
    return;
  }
  if (textToFind == "") {
    alert("Вы ничего не ввели");
    return;
  }
   
  if(document.body.innerHTML.indexOf(textToFind)=="-1")
  alert("Ничего не найдено, проверьте правильность ввода!");
   
  if(copy_page.length>0)
        document.body.innerHTML=copy_page;
  else copy_page=document.body.innerHTML;
 
   
  document.body.innerHTML = document.body.innerHTML.replace(eval("/name="+lastResFind+"/gi")," ");//стираем предыдущие якори для скрола
  document.body.innerHTML = document.body.innerHTML.replace(eval("/"+textToFind+"/gi"),"<a name="+textToFind+" style='background: gold'>"+textToFind+"</a>"); //Заменяем найденный текст ссылками с якорем;
  lastResFind=textToFind; // сохраняем фразу для поиска, чтобы в дальнейшем по ней стереть все ссылки
  window.location = '#'+textToFind;//перемещаем скрол к последнему найденному совпадению
 }
</script>

Новые блоги и статьи Все статьи Все блоги /
Доступность команды формы по условию Maks 07.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: сделать доступной кнопку (команда формы "ЗавершитьСписание") при. . .	Уведомление о неверно выбранном значении справочника Maks 06.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "НарядПутевка", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если в документе выбран неверный склад. . .	Установка Qt Creator для C и C++: ставим среду, CMake и MinGW без фреймворка Qt 8Observer8 05.04.2026 Среду разработки Qt Creator можно установить без фреймворка Qt. Есть отдельный репозиторий для этой среды: https:/ / github. com/ qt-creator/ qt-creator, где можно скачать установщик, на вкладке Releases:. . .	AkelPad-скрипты, структуры, и немного лирики.. testuser2 05.04.2026 Такая программа, как AkelPad существует уже давно, и также давно существуют скрипты под нее. Тем не менее, прога живет, периодически что-то не спеша дополняется, улучшается. Что меня в первую очередь. . .
Отображение реквизитов в документе по условию и контроль их заполнения Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеСпецтехники", разработанного в конфигурации КА2. Данный документ берёт данные из другого нетипового документа. . .	Фото всей Земли с борта корабля Orion миссии Artemis II kumehtar 04.04.2026 Это первое подобное фото сделанное человеком за 50 лет. Снимок называют новым вариантом легендарной фотографии «The Blue Marble» 1972 года, сделанной с борта корабля «Аполлон-17». Новое фото. . .	Вывод диалогового окна перед закрытием, если документ не проведён Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать программный контроль на предмет проведения документа. . .	Программный контроль заполнения реквизитов табличной части документа Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: 1. Реализовать контроль заполнения реквизита. . .

@atanov 640 / 481 / 172 Регистрация: 26.05.2016 Сообщений: 2,674
	12.01.2018, 07:21
	В регулярках попробуйте добавить ещё один флаг, конец будет так: /gi Да, и eval использовать не очень хорошо 0

@Lara Semenova 0 / 0 / 0 Регистрация: 17.08.2017 Сообщений: 30
	15.01.2018, 12:32 [ТС]
	Спасибо, но не могли бы вы более подробно расписать куда нужно это дописать? Я очень мало знаю о Дж-С, но применеие требуется уже сейчас 0

@Lara Semenova 0 / 0 / 0 Регистрация: 17.08.2017 Сообщений: 30
	15.01.2018, 18:43 [ТС]
	ничего не изменилось 0