Удаление всего, кроме чисел, из строки
Описание проблемы
Я создал небольшой калькулятор на JavaScript, где пользователи могут ввести процентную ставку и сумму, которую они хотят занять, и программа рассчитывает, какую сумму они могут получить в качестве стимула.
Проблема в том, что я беспокоюсь о том, что пользователи могут вводить символы, например:
Сумма займа: £360,000 - Процентная ставка: 4.6%
Меня не волнуют десятичные знаки, так как они необходимы и, как кажется, не влияют на расчет. Однако символы, такие как £ и %, могут вызвать ошибки.
Существует ли простой способ удалить эти символы из кода:
<td><input type="text" name="loan_amt" style="background-color:#FFF380;"></td>
<td><input type="text" name="interest_rate" style="background-color:#FFF380;"></td>
И в JavaScript:
function Calculate()
{
var loan_amt = document.getElementById('loan_amt').value;
// это как я получаю введённую сумму займа
var interest_rate = document.getElementById('interest_rate').value;
// это как я получаю процентную ставку
alert(interest_rate);
}
Как можно безопасно обработать ввод, чтобы удалить символы и оставить только числовые значения?
5 ответ(ов)
Вот самый короткий способ сделать это:
replace(/\D/g, '');
Этот код использует регулярное выражение для замены всех символов, которые не являются цифрами, на пустую строку, effectively оставляя только цифры.
Вот мое решение:
const filterNum = (str) => {
const numericalChar = new Set([ ".", ",", "0", "1", "2", "3", "4", "5", "6", "7", "8", "9" ]);
str = str.split("").filter(char => numericalChar.has(char)).join("");
return str;
}
console.log(filterNum("143.33$"));
// 143.33
Данный код создает функцию filterNum
, которая принимает строку и фильтрует ее, оставляя только числовые символы и знаки для десятичной дроби (точку и запятую). Сначала строка разбивается на массив символов, затем с помощью filter
остается только те символы, которые содержатся в множестве numericalChar
. В конце массив символов соединяется обратно в строку. Таким образом, из строки "143.33$"
получается "143.33"
.
Есть очень хороший плагин, который вы можете использовать. Например, вы можете включить файлы jQuery.js и autoNumeric-1.8.3.js в заголовке вашего документа следующим образом:
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script src="autoNumeric-1.8.0.js" type="text/javascript"></script>
В этом примере используется выборщик по ID и не передаются дополнительные опции. Вот как это выглядит:
jQuery(function($) {
$('#someID_defaults').autoNumeric('init');
});
Дополнительную информацию можно найти по следующей ссылке: http://www.decorplanit.com/plugin/
Попробуйте следующий код:
var a = "4.52%";
var stringLength = a.length;
var lastChar = a.charAt(stringLength - 1);
if (lastChar.match(/[^\w\s]/)) {
a = a.substring(0, stringLength - 1);
}
alert(a);
Теперь вы можете привести строку к числу.
Чтобы удалить все символы, кроме чисел с плавающей запятой, и избежать возможности ввода двойной точки, вы можете использовать предложенную функцию removeAllButFloatFromInput
. Эта функция отслеживает события ввода, изменения и вставки на элементе input
и фильтрует введенные символы, чтобы оставить только допустимые (цифры и точку).
Вот как это работает:
- Функция получает
input
и необязательный параметрfloatAmount
, который определяет количество цифр после запятой. - При любом изменении в поле (ввод, изменение, вставка) мы получаем текущее значение и разбиваем его на отдельные символы.
- Фильтруем символы, оставляя только цифры и одну точку.
- Если найдена одна точка, обрабатываем количество цифр после запятой в зависимости от наличия параметра
floatAmount
. - Если пользователь уходит из поля (событие
blur
), мы преобразуем значение в число с плавающей запятой с заданным количеством знаков после запятой, если это применимо.
Пример использования этой функции:
removeAllButFloatFromInput("#myInput", 2); // Применить к элементу с ID myInput и разрешить 2 знака после запятой
Это обеспечивает простое и эффективное решение для контроля формата ввода чисел с плавающей запятой, избегая распространенной проблемы с дублированием точки. Если у вас есть дополнительные вопросы или нужны уточнения по коду, не стесняйтесь спрашивать!
Как использовать переменную в регулярном выражении?
Как разделить строку с несколькими разделителями в JavaScript?
Экранирование строки для использования в регулярных выражениях JavaScript [duplicate]
Как удалить все переносы строк из строки
JavaScript Regexp - Найти символы после определённой фразы