Knockout.js 输入字段上的动态货币格式

我想问您是否可以动态格式化输入值？
因此，当我输入某个值时，它将动态添加逗号以格式化货币。
例如，我正在写1234，它将被动态格式化为1'234。
如果我删除一个数字，它将更改为123。
我在考虑一些定制装订。但是，是否有可能为每一项更改添加一条规则

Cheel

您可以使用它并创建自定义绑定：

ko.bindingHandlers.numeric = {
    update: function(element, valueAccessor, allBindingsAccessor) {
       var value = ko.utils.unwrapObservable(valueAccessor());
       var positions= ko.utils.unwrapObservable(allBindingsAccessor().positions) || ko.bindingHandlers.numeric.defaultPositions;
       var formattedValue = parseFloat(value).toFixed(positions); 
       var finalFormatted = ko.bindingHandlers.numeric.withCommas(formattedValue);  

        ko.bindingHandlers.text.update(element, function() { return finalFormatted; });
    },
    defaultPositions: 2,
    withCommas: function(original){
       original+= '';
        x = original.split('.');
        x1 = x[0];
        x2 = x.length > 1 ? ',' + x[1] : '';
        var rgx = /(\d+)(\d{3})/;
        while (rgx.test(x1)) {
            x1 = x1.replace(rgx, '$1' + '.' + '$2');
        }
        return x1 + x2;      
    } 
};

然后，如果将值绑定到元素，则只需使用此绑定，而不是正常的

文本
绑定：

<span data-bind="numeric: myNumericObservable"></span>

您可以按如下方式使用它：

<input tabindex="10" data-bind="numericValue: myNumericObservable">



您还可以配置它：

<input data-bind="numericValue: myNumericObservable, positions: 0, noDecimalPoints: true">

我已经写了我需要的：）

这是我的工作

我的代码是：

function TestViewModel() {
  var self = this;
  self.myCurrency = ko.observable();
}

ko.bindingHandlers.currencyFormat = {
  init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
    ko.utils.registerEventHandler(element, 'keyup', function (event) {
        var observable = valueAccessor();
        observable(formatInput(element.value));
        observable.notifySubscribers(5);
    });
  },
  update: function (element, valueAccessor, allBindingsAccessor) {
    var value = ko.utils.unwrapObservable(valueAccessor());
    $(element).val(value);
  }
};

function formatInput(value) {
  value += '';

  value = value.replace(/,/g, '');
  var rgx = /(\d+)(\d{3})/;
  while (rgx.test(value)) {
    value = value.replace(rgx, '$1' + ',' + '$2');
  }

  return value;
}

$(document).ready(function () {
  ko.applyBindings(new TestViewModel());
});

享受它
只需谷歌搜索一下computed observable我忘了提到我知道用computed observable做这件事是可能的。但我想知道是否有可能进行自定义绑定？看看这把小提琴，如果你擅长javascript，你可以修改自己。查看iti中的值电流自定义绑定我已使此小提琴只需输入数字，然后您就可以看到其格式如您所愿。虽然它有很多问题，但可以给你一个好主意。希望对你有帮助不，不是。因为它只添加一次逗号。我想在非的输入中添加此格式。谢谢。不幸的是，这不是我想要的。我准备了一份展示我想做什么的报告。我使用ko.pureComputed，但我需要bindinghandler。删除不起作用。我不想使用computed，因为我会有很多这样的输入。我已经准备好使用ko.pureComputed（）。知道如何将其更改为BindingHandler吗？
function TestViewModel() {
  var self = this;
  self.myCurrency = ko.observable();
}

ko.bindingHandlers.currencyFormat = {
  init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
    ko.utils.registerEventHandler(element, 'keyup', function (event) {
        var observable = valueAccessor();
        observable(formatInput(element.value));
        observable.notifySubscribers(5);
    });
  },
  update: function (element, valueAccessor, allBindingsAccessor) {
    var value = ko.utils.unwrapObservable(valueAccessor());
    $(element).val(value);
  }
};

function formatInput(value) {
  value += '';

  value = value.replace(/,/g, '');
  var rgx = /(\d+)(\d{3})/;
  while (rgx.test(value)) {
    value = value.replace(rgx, '$1' + ',' + '$2');
  }

  return value;
}

$(document).ready(function () {
  ko.applyBindings(new TestViewModel());
});