JQuery - поле ввода - как дублировать и конвертировать в SEO дружественных URL

Question

У меня есть два поля ввода HTML article и url.

Как продублировать запись поля 'article' в поле 'url' для ссылки, дружественной SEO! url допустимые символы a-z (заглавные буквы преобразуются в нижний регистр), url символ пробела заменить на тире -, url другие символы игнорируются. требуется ввод только в поле article

<input type="text" name="article">

url поле автоматически генерируется и обновляется в поле jquery article значение

<input type="text" name="url">

Answer 1

Это должно работать:

function name_to_url(name) {
    name = name.toLowerCase(); // lowercase
    name = name.replace(/^\s+|\s+$/g, ''); // remove leading and trailing whitespaces
    name = name.replace(/\s+/g, '-'); // convert (continuous) whitespaces to one -
    name = name.replace(/[^a-z-]/g, ''); // remove everything that is not [a-z] or -
    return name;
}

, а затем

$('input[name=article]').blur(function() {
    $('input[name=url]').val(name_to_url($(this).val())); // set value
});

Устанавливает значение в поле URL каждый раз, когда поле статьи теряет фокус.

---

Он сохраняет уже существующий - в имени. Поэтому, если вы хотите удалить их тоже, вам нужно изменить вторую последнюю и третью последнюю строку name_to_url() на:

name = name.replace(/[^a-z ]/g, ''); // remove everything that is not [a-z] or whitespace
name = name.replace(/\s+/g, '-'); // convert (continuous) whitespaces to one -

---

Ссылка: .blur(), .val(), .toLowerCase(), .replace()

---

Обновление:

Я бы создал новую функцию, скажем, update_URL():

function update_URL() {
     var value = name_to_url($('input[name=article]').val()) + '-' + $('input[name=year]').val();
     $('input[name=url]').val(value)
}

тогда вы можете вызывать эту функцию для любого события, например, на keyup():

$('input[name=article]').keyup(function() {
    update_URL();
});