Как разрешить добавлять только дефисы или нижнее подчеркивание?

Question

[Genri_Rus]

В данном примере происходит замена только на дефис, а как можно сделать и при вводе нижнего подчеркивания?
Т.е. нужно сделать замену пробелов или других спецсимволов на дефис или нижнее подчёркивание.

Answer 1

[Чипекве]

const input = document.querySelector('.word');

const divider = '-';
const secondDivider = '_';

const dividerRules = [
    { pattern: `[a-z0-9_-]`, replacement: divider },
    { pattern: `[\\${divider}\\${secondDivider}]+`, replacement: (match) => match[0] },
    { pattern: `^[\\${divider}\\${secondDivider}]+|[\\${divider}\\${secondDivider}]+$`, replacement: '' },
]

const valueReplacer = (input, rules) => {
    rules.forEach(({ pattern, replacement }) => input.value = input.value.replace(new RegExp(pattern, 'gi'), replacement));
}

input.addEventListener('change', ({ target }) => {
    valueReplacer(target, dividerRules);
});

Comments

[Genri_Rus]

Спасибо большое, а вот можно ли как-то удалять все спецсимволы и пробел в том числе в начале и конце?

Т.е. допустим если в инпут вставить текст например: code code, то он заменялся на code-code и так для любого текста с пробелом?

показать

[Чипекве]

Исправил, должно теперь нормально работать
`\W` на `\\W`

Кириллица, кстати, будет удаляться тут. Если она нужна, нужно поменять `\\W` на `[^a-z0-9а-яё_-]`

[Genri_Rus]

Чипекве, понял.
Спасибо вам за помощь!

[Genri_Rus]

Чипекве, а вот возникла еще одна проблема, если плюс добавить то заменяется на дефис вот так:

показать

Т.е. можно ли удалять данные символы и оставить только один дефис или одно нижнее подчёркивание?

[Чипекве]

исправил `\\${divider}+|\\${secondDivider}+`на `[\\${divider}\\${secondDivider}]+`

Может быть проще тогда было использовать только один разделитель?

[Genri_Rus]

Чипекве, спасибо, это я в этом примере смотрел

Только у меня идея была в создании произвольных полей для сайта (бэкенд php), чтобы было удобнее с помощью ключа выводить произвольные поля.
Но как вы написали, то наверное мне лучше ключи (названия в кириллице) в нижнем подчёркивании в массиве php сохранять.