Автоподстветка тэгов в тексте на javascript

Возникла задача. Требуется автоматически в тексте подсвечивать введенные пользователем тэги, т.е. текст вида #xxxx .

Решить данную задачу можно с помощью регулярных выражений на javascript.

Решение:

<style>
.hash_tag { color: #84A432; text-decoration: none; }
</style>
<script type="text/javascript">
var mydiv = $(‘#div’);
var text = mydiv.html();
text = text.replace( /[\s|&nbsp;](#.+?)(?=\s|&nbsp;)/g,
'<span class="hash_tag">$1</span>' );
mydiv.html(text);
</script>

 

где,

  • [\s|&nbsp;] – означает, что перед выражением должен быть или пробел, или со знака неразрывного пробела;
  • (?=\s|&nbsp;|,|\.) – за нашим тегом следует пробел, неразрывный пробел, запятая или точка;
  • (#.+?) – текст нашего тега, который начинается с символа #;
  • <span class=”hash_tag” >$1</span> – html тэги в которые мы оборачиваем найденный тэги;
  • g – окружить все найденные теги.

Пример использования можно видеть тут.

Данные возможности можно использовать для автоподсветки вводимых сообщений пользователя.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *