Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 29.06.2021, 15:11
Интересующийся
Отправить личное сообщение для vlad_kl Посмотреть профиль Найти все сообщения от vlad_kl
 
Регистрация: 16.06.2020
Сообщений: 22

RegExp для форматирования input.value
Добрый день.
Есть задача, создать input.value с мгновенным форматированием числа.
Нечто похожее https://www.omnicalculator.com/finance/margin

Юзер вводит 5000 - инпут сразу меняется на 5,000 и так далее.
Это можно решить следующим кодом
input.value = input.value.split(',').join('').replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,")

Но при input type = number это, увы, не работает.

В таком случае выход следующий - сделать input type = text и добавить запрет на ввод любых символов, кроме цифр 0-9, запятой, минуса и точки.

Прошу вашей помощи с регуляркой, которая будет убирать все "неразрешённые символы". В моём случае, разрешены цифры, запятая, минус и точка. Всё остальное запрещено.

Спасибо
Ответить с цитированием
  #2 (permalink)  
Старый 29.06.2021, 15:23
Интересующийся
Отправить личное сообщение для vlad_kl Посмотреть профиль Найти все сообщения от vlad_kl
 
Регистрация: 16.06.2020
Сообщений: 22

Кажется, придумал решение
input.value = input.value.replace(/[^0-9-,.]/g, '');
Ответить с цитированием
  #3 (permalink)  
Старый 29.06.2021, 15:27
Кандидат Javascript-наук
Отправить личное сообщение для od0201 Посмотреть профиль Найти все сообщения от od0201
 
Регистрация: 07.05.2020
Сообщений: 108

split(',').join('') не зря там стоят...

нужно преобразовать число в строку используя String()

alert(String(5000).split(',').join('').replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,"))


оформите правильно вопром, покажите нерабочий пример

Последний раз редактировалось od0201, 29.06.2021 в 15:30.
Ответить с цитированием
  #4 (permalink)  
Старый 29.06.2021, 15:31
Интересующийся
Отправить личное сообщение для vlad_kl Посмотреть профиль Найти все сообщения от vlad_kl
 
Регистрация: 16.06.2020
Сообщений: 22

input.value и так строка) зачем оборачивать input.value в String() ???
Ответить с цитированием
  #5 (permalink)  
Старый 29.06.2021, 15:44
Кандидат Javascript-наук
Отправить личное сообщение для od0201 Посмотреть профиль Найти все сообщения от od0201
 
Регистрация: 07.05.2020
Сообщений: 108

Сообщение от vlad_kl Посмотреть сообщение
input.value и так строка) зачем оборачивать input.value в String() ???
откуда я знаю как у Вас, покажите рабочий или нерабочий пример

если у вас на выходе текст, то регулярка работает,
'5000'.split(',').join('').replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,")


у вас проблема с присваиванием так как на выходе у регулярки текст, Вы не можете вставить текст в input type = number
Ответить с цитированием
  #6 (permalink)  
Старый 29.06.2021, 15:48
Интересующийся
Отправить личное сообщение для vlad_kl Посмотреть профиль Найти все сообщения от vlad_kl
 
Регистрация: 16.06.2020
Сообщений: 22

Да я ж уже написал, что я уже нашёл решение.
Первая регулярка - работает.
Мне нужна была вторая регулярка.
let input = document.querySelector('#input')
input.addEventListener('input', () => {
    input.value = input.value.replace(/[^0-9-,.]/g, '');
    input.value = input.value.split(',').join('').replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,")
})
Ответить с цитированием
  #7 (permalink)  
Старый 29.06.2021, 16:09
Кандидат Javascript-наук
Отправить личное сообщение для od0201 Посмотреть профиль Найти все сообщения от od0201
 
Регистрация: 07.05.2020
Сообщений: 108

сорри , это я не дочитал задание

по вашему коду
найденному решению, немного лишнего
цель:нужно удалить все кроме чисел и '.', и поставить ","
у Вас же
split(',').join('') удаляет ",", это лишнее, так как дальше мы удалим ее
replace(/[^0-9-,.]/g, '') удаляет все, кроме чисел, "," хотя "," не нужна.

оставьте так

let input = document.querySelector('#input')
input.addEventListener('input', () => {   
    input.value = input.value.replace(/[^.0-9]/g,"").replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,")
})


был бы рабочий или нерабочий пример типа [НTML run]...[/html], потестили бы

Последний раз редактировалось od0201, 29.06.2021 в 16:18.
Ответить с цитированием
  #8 (permalink)  
Старый 29.06.2021, 16:57
Аватар для Vlasenko Fedor
Профессор
Отправить личное сообщение для Vlasenko Fedor Посмотреть профиль Найти все сообщения от Vlasenko Fedor
 
Регистрация: 13.03.2013
Сообщений: 1,572

<input is="input-separator" id="test" value=""/>
<button onclick="alert(test.value)">Show value</button>
<script>
    customElements.define('input-separator', class extends HTMLInputElement {
        constructor() {
            super();
            addEventListener('input', _ => {
                this.value = new Intl.NumberFormat('en-GB').format(this.value.replace(/\D+/g, ''));
            })
        }
    }, {extends: 'input'});
</script>

вариант
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Правильно вызвать массив biryukovm Элементы интерфейса 3 19.03.2018 13:31
Помогите написать RegExp для вычленения субнетов из IP адресов Kvark Общие вопросы Javascript 6 26.01.2015 16:21
[job] JS-разработчик (+Angular) на UI внутреннего проекта (для других разработчиков:) Anna-HR Работа 12 19.01.2015 13:50
подскажите RegExp для замены пустых строк в тексте. mitiya Общие вопросы Javascript 21 07.08.2012 14:02