Javascript 在数组中使用事件处理程序创建可观察对象

我有一个项目列表，每个项目由许多文本字段组成。文本字段需要使用事件处理程序进行观察，以便在用户更改条目时调用事件处理程序并相应地执行操作

以下是数组声明：

self.items = ko.observableArray(ko.utils.arrayMap(items, function(item) {
    return { quantity: item.quantity, size: item.size };
}));

…还有一个文本框，用于显示总数量。基本上，在编辑数组行中的数量时，我需要文本框来显示运行总数：

总计：输入数据绑定=“值：总计”

我在这里创建了一个JSFIDLE：

其思想是，如果用户在其中一个项目中输入/更改数量，则将更新给定大小的总和，并更新生成的总值

欢迎任何建议-我是否应该尝试使用此处描述的方法：

---

谢谢查看：）

您应该使用

ko.computed

函数。需要观察数量和大小以更新总数。因此，需要将其看作是面向对象的，并且需要将其作为一个模型

var initialData = [
    { quantity: "100", size: "8" },
    { quantity: "200", size: "10" }
];
var Item = function (q, s) {
    this.quantity = ko.observable(q),
    this.size = ko.observable(s)
}
var ItemsModel = function(items) {
    var self = this;
    self.items = ko.observableArray(ko.utils.arrayMap(items, function(item) {
        return new Item(item.quantity, item.size);
    }));
    self.addItem = function() {
        self.items.push(new Item(1,1));
    };
    self.removeItem = function(item) {
        self.items.remove(item);
    };
    self.total = ko.computed(function() {
        var total = 0;
        ko.utils.arrayForEach(this.items(), function(item) {
            total += item.quantity() * item.size();
        });
        return total;
    }, self);
};

ko.applyBindings(new ItemsModel(initialData));

---

直播：

感谢您的快速回复和JSFIDLE的解释-非常感谢！）