Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Класс RegExp (https://javascript.ru/forum/jquery/69538-klass-regexp.html)

LinaInverse 01.07.2017 22:08

Класс RegExp
 
<head>
	<meta charset="utf-8">
</head>
<body>
	<input type="text">
	<div>Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Свой подзаголовок, эта напоивший текста по всей до одна несколько обеспечивает свой все, рукописи мир то продолжил скатился дал алфавит всеми.</div>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
	<script>
$('input').keyup(function(){
var inp = new RegExp($(this).val(), 'g');
var str = $('div').text().replace(inp, '<span style="color:red">'+inp+'</span>');
$('div').html(str);
});
	</script>
</body>

Как поправить? чтоб спец символы не вылазили. Пожалуйста

рони 01.07.2017 22:19

LinaInverse,
<head>
  <meta charset="utf-8">
</head>
<body>
  <input type="text">
  <div>Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Свой подзаголовок, эта напоивший текста по всей до одна несколько обеспечивает свой все, рукописи мир то продолжил скатился дал алфавит всеми.</div>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script>
function escapeRegExp(string){
  return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
}

var str = $('div').text();
$('input').on('input', function(){
var v = this.value;
var inp = new RegExp(escapeRegExp(v), 'g'); 
var text = str.replace(inp, '<span style="color:red">'+v+'</span>');
$('div').html(text);
});
  </script>
</body>

рони 01.07.2017 22:23

Rise,
они найденное RegExp перезаписывают на RegExp :)

рони 01.07.2017 22:27

LinaInverse,
исправил немного код, скопируйте заново пост№2

рони 01.07.2017 22:37

LinaInverse,
this.value лучше не трогать ...
var text = str.replace(inp, '<span style="color:red">'+this.value+'</span>');

или смотрите код выше

рони 01.07.2017 22:40

LinaInverse,
:lol:
окончательный вариант ...
var str = $('div').text();
$('input').on('input', function(){
var v = this.value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
var inp = new RegExp(v, 'g');
var text = str.replace(inp, '<span style="color:red">$&</span>');
$('div').html(text);
});

MallSerg 01.07.2017 22:51

Цитата:

Сообщение от LinaInverse (Сообщение 457177)
Рони, а вы не в курсе нет ли где конструктора для создания регулярного выражения "Для чайников".

https://regex101.com/

LinaInverse 01.07.2017 22:54

Цитата:

Сообщение от MallSerg (Сообщение 457179)

спасибо, жалко что все на инглише.


Часовой пояс GMT +3, время: 07:33.