Хочу переделать скрипт добавляющий определенные символы

184

04 июня 2022, 01:40

Делаю скрипт на jquery, который должен добавлять к определенному символу/словосочетанию/цифрам также определенные символы/словосочетания/цифры. Например в поле textarea пишем "123" и в реальном времени добавляется "456" без пробела. Или например вводим "соба", где без пробела должен добавляться слог "ка". При этом важно, чтобы слог, который добавлялся бы не был виден в самом окне textarea, для этого требуется прямо в строчке в коде установить style (fonts-size:0px;), сам текст с добавленными символами будет виден уже после отправки в условном письме или комментарии. А также возможность составить некую базу из подобных слов прямо в коде строчка за строчкой, другими словами добавлять от 10+ символов/слов/цифр/ для добавления. За основу я взял скрипт по замене символов, но он к сожалению не выполняет всех нужных задач. Не работает если установлено более одной строчки со словом для замены. Не добавляет, а заменяет символы. И нет возможности установить (fonts-size:0px;) к слову, которое добавляется к символу.

<textarea></textarea>
$("textarea").on('keyup', function() {
  let value = $(this).val();
  $(this).val(value.replace('123', '456'));
  $(this).val(value.replace('соба', 'ка'));
  $(this).val(value.replace('свобо', 'да'));
  //и так далее..
});

Answer 1

Так?

let rep = [ // Некий словарь
  ['123', '456'], // [слово, окончание]
  ['соба', 'ка'],
  ['свобо', 'да'],
  ['\\*S77', '#G228'] // !!! экранируйте символы двойным обратным слешем (\\) !!!
];
    
$('#message').on('keyup', function(){
  let text = $(this).val(); // Берём весь текст из textarea #message
  for(let i = 0; i < rep.length; i++) { // Проходим циклом по словарю
    let reg = new RegExp('(^|\\s|\\W)'+rep[i][0]+'(\\s|\\W|$)', 'gm'); // Создаём регулярное выражение
    text = text.replace(reg, '$1'+rep[i][1]+'$2'); // Заменяем первое слово из словоря, на слово+окончание
  }
  $('#replace').val(text); // Добавляем новый текст в отдельный textarea replace
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea id="message"></textarea>
<textarea id="replace"></textarea>