【问题标题】:Bind multiple input with the same obervable knockoutjs to perform the same action用同一个可观察的敲除js绑定多个输入来执行相同的动作
【发布时间】:2012-11-15 01:01:03
【问题描述】:

我想用相同的 observable(相同的动作)绑定多个文本输入

<input id="test1" name="test1" type="text" data-bind="value: searchQuantity"/>
<input id="test2" name="test2" type="text" data-bind="value: searchQuantity"/>

var viewModel = {
        searchQuantity: ko.observable(),
    };


<p>You have typed: <span id="spantest1" data-bind="text: searchQuantity"></span></p>
<p>You have typed: <span id="spantest2" data-bind="text: searchQuantity"></span></p>

但是当我更改输入 test1 的值时,它会更改 test2 的值。

我想对两个输入执行相同的操作,但我想更改对应跨度的值。 (这只是一个示例,因此我可以在带有文本框的网格上执行相同的操作;我希望在更改文本框时重新计算包含已更改文本框的同一列上所有文本框的总和。)


我认为我没有很好地解释我的问题。

请看截图

我真正想要的是在更改红色文本框中的值时,绿色单元格将更新为列的总和(总和将按年份)。

谢谢。

【问题讨论】:

    标签: knockout.js


    【解决方案1】:


    请查看我为您创建的this demo
    HTML 代码

    <input id="test1" name="test1" type="text" data-bind="value: searchQuantity1, valueUpdate:'afterkeydown'"/>
    <input id="test2" name="test2" type="text" data-bind="value: searchQuantity2, valueUpdate:'afterkeydown'"/>
    
    <p>Test1 value is : <span id="spantest1" data-bind="text: searchQuantity1"></span></p>
    <p>Test2 value is : <span id="spantest2" data-bind="text: searchQuantity2"></span></p>
    <p>Sum: <span id="spantest3" data-bind="text: spans"></span></p>
    


    Javascript 代码

    var viewModel = function(data) {
      var self = this;
      self.searchQuantity1 = ko.observable(1);
      self.searchQuantity2 = ko.observable(2);
      self.spans = ko.computed(function() {
          return Number(self.searchQuantity1 ())+Number(self.searchQuantity2 ());
      }, self);
    };
    
    ko.applyBindings(new viewModel());
    


    它能回答你的问题吗?
    谢谢。

    【讨论】:

    • 不,请检查我的答案。
    猜你喜欢
    • 2019-07-18
    • 1970-01-01
    • 2018-09-23
    • 2019-06-14
    • 2016-07-27
    • 2013-05-07
    • 2014-07-24
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多