JavaScript / jQuery Regex Заменить поле ввода допустимыми символами - PullRequest
4 голосов
/ 04 июля 2011

Я создаю CMS, где пользователь может настроить SEO-URL страницы с помощью элемента управления вводом текста. Например, скажем, пользователь создает галерею и хочет, чтобы его страница была открыта по адресу http://www.theirsite.com/my-1st-gallery.

Обратите внимание, что часть my-1st-gallery не содержит недопустимых символов для URL. Поскольку большинство пользователей не будут знать, что разрешено и не разрешено, я хотел бы создать фильтр регулярных выражений JavaScript, который может фильтровать / преобразовывать все недопустимые символы при вводе ключа.

Я знаю, как использовать jQuery / JavaScript для прослушивания событий нажатия клавиш, но я не уверен, как использовать регулярные выражения для следующих действий:

  1. Отфильтровать все символы, кроме a-z, A-Z, 0-9, a "-", "_" и пробела.
  2. Измените любые "_" и пробелы на "-", и дайте пользователю знать, что данный символ был преобразован в "-".

Может ли кто-нибудь предоставить хороший пример того, как выполнить часть регулярного выражения. Опять же, я понимаю, как прислушиваться к событиям нажатия клавиш.

Спасибо, что уделили время!


Хорошо, со всеми этими хорошими ответами, я думаю, я могу собрать это вместе для своего веб-приложения. Я хотел бы выбрать более одного ответа в качестве моего финала! : S Спасибо всем!

Ответы [ 5 ]

8 голосов
/ 04 июля 2011
$("#inputElement").keyup(function() {
    var input = $(this),
    var text = input.val().replace(/[^a-zA-Z0-9-_\s]/g, "");
    if(/_|\s/.test(text)) {
        text = text.replace(/_|\s/g, "");
        // logic to notify user of replacement
    }
    input.val(text);
});
2 голосов
/ 04 июля 2011

Вы можете сделать что-то вроде этого (если у вас есть символ, сохраненный в переменной key)

if(key.test(/[_\s]/)){
   key = "-";
   alert("key changed to -");  
}
if(!key.test(/[a-zA-Z0-9\-]/g){
  key = "";
  alert("Invalid key");
}

Надеюсь, это поможет.Приветствия

2 голосов
/ 04 июля 2011

Допускается регулярное выражение для удаления всех символов, отличных от указанных вами, а затем замены "_" и "" на "-":

var inputVal = $('input.myField').val();
var newVal = inputVal.replace(/[^A-Za-z0-9\-_\s]/g, '').replace(/[_\s]/g, '-');
if (newVal != inputVal) {
  alert('We modified something!');
  // Do some more things...
}
$('input.myField').val(newVal);
1 голос
/ 04 июля 2011

Это отфильтрует символы для (1):

/[^a-zA-Z0-9\-_ ]/g

/ - это разделители регулярных выражений в JavaScript.[] разделяет класс символов, а ^ внутри класса символов означает «соответствовать всем символам , а не »внутри этого класса ".Затем вы можете указать отдельные символы внутри класса (например, «-» и «_») или указать диапазон (например, «az»).

g вне разделителей используется в качестве флага для«глобальный поиск», который просто означает, что регулярное выражение совпадает более одного раза, в противном случае оно остановится при первом совпадении, а затем прекратит поиск.\ используется как escape-символ, который я использую для экранирования дефиса в классе символов, потому что он используется как метасимвол внутри классов символов для указания диапазонов символов.

На самом деле я не уверенесли это необходимо, потому что я не нашел ничего в документах по регулярным выражениям JavaScript Java, PHP и Mozilla, в которых говорится, что дефисы должны быть экранированы таким образом, и мои тесты в Firefox 5 и Chrome 12 показывают, что это работает в любом случае.

Вы можете узнать больше о регулярных выражениях JavaScript в документации по Mozilla и проверить свои регулярные выражения в http://regexpal.com/.

0 голосов
/ 08 сентября 2014
...