0

Есть инпут. Нужно чтобы , когда пользователь вводит число например 2,3445 оно автоматически заменялось на 2.34 .

var inp = $('.num');
$('.num').keyup(function () {
      
    if (!this.value.match(/^[0-9,.]+$/)) {
        this.value = this.value.replace(/[^0-9,.]/g, '');
    }
       
     var val = $('.num').val();
     //console.log(val);
     var numReplace = val.replace(",", ".");
     var numToFloat = parseFloat(numReplace);
     var num = numToFloat.toFixed(2);
     inp.val(num);
   
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class='num' > </input>

В консоли все работает, но вот в реальном инпуте нет. Число то заменяется, но потом курсор встает в конец строки и очень сложно тогда его отредактировать. Как сделать чтобы после автокорекции числа его можно было без проблем снова изменять?

3
  • Встречный вопрос: а как программа должна понимать, что пользователь закончил ввод числа? 8 ноя 2016 в 18:56
  • не знаю . поэтому и обратился сюда 8 ноя 2016 в 18:57
  • а может просто повесить на input change? Получится что когда пользователь закончил ввод, все и округляется и запятая заменяется... И пользователь обращать внимание не будет и вам проще и не нужно 100 раз проверять корректность ввода...
    – Geri4
    9 ноя 2016 в 1:11

1 ответ 1

0

Проблема Вашего кода в том, что неизвестно когда пользователь заканчивает ввод. С большой долей вероятности можно предположить, что когда он покидает input, то он ввел именно то, что хотел.

Поэтому можно заменить keyup на blur. После этого, если понадобится, можно вернуться и отредактировать значение без проблем.

var inp = $('.num');
$('.num').blur(function () {
      
    if (!this.value.match(/^[0-9,.]+$/)) {
        this.value = this.value.replace(/[^0-9,.]/g, '');
    }
       
     var val = $('.num').val();
     //console.log(val);
     var numReplace = val.replace(",", ".");
     var numToFloat = parseFloat(numReplace);
     var num = numToFloat.toFixed(2);
     inp.val(num);
   
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class='num' > </input>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.