Блог

Главная - Вопросы по программированию - Knockout JS считает только числа в атрибуте maxLength

Knockout JS считает только числа в атрибуте maxLength

#html #knockout.js

#HTML #knockout.js

Вопрос:

Есть ли способ манипулировать атрибутом maxLength для подсчета только чисел? Я видел этот код MyObservable.replace(/[^0-9]/g, '').length , который может считать только числа, но я не знаю, куда его поместить. Или любая идея получше. Спасибо

Комментарии:

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

2. да, мне нужен другой способ вычисления максимальной длины с подсчетом только чисел, потому что у меня есть что-то вроде ввода налоговой ставки и допускает десятичное и max value of 100 , но я не хочу включать точку (.) в длину подсчета, и я не хочу иметь значение тысячи, так maxLength="3" or maxlength="5" что это не то, что мне нужно.

Ответ №1:

Вам нужно будет использовать пользовательскую привязку, если вы хотите ограничить определенную величину вместо длины строки. Есть 2 варианта, при одном вы остаетесь с an input="text" , а второй является an input="number"

Разница в том, что с первым вам нужно будет включить регулярное выражение, похожее на ваш пример, в следующий фрагмент кода, где со вторым вариантом браузер уже позаботился об этом, я оставлю это на ваше усмотрение, куда вы хотите пойти с этим.

 ko.bindingHandlers.maxValue = {
    init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
        var valueObservable = valueAccessor();

        ko.utils.registerEventHandler(element, "change", function () {
            var value = Number(element.value);
          if (value >= 0) {
            if (value > allBindings().maxAmount) {
                value = allBindings().maxAmount;
            }
            element.value = value;
            valueObservable(value);
          }
        });
    },
};

var ViewModel = function ()
{
    var self = this;
  self.value = ko.observable();
};

ko.applyBindings(new ViewModel()); 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<input type="number" data-bind="maxValue: $root.value, maxAmount: 100" />