javascript - 如何更改订阅函数内部可观察值的值?

标签 javascript jquery knockout.js radio-button subscribe

如何更改订阅函数内部的可观察值? 例如

JS 模型:

function Model(){
    self = this;
    self.Test = ko.observable(2);
    self.Test.subscribe(function (){
      if (/**Some bool expression**/) {
         self.Test(2);
      }
    });
}

HTML:

<input type="radio" value="1" data-bind="checked:Test" />
<input type="radio" value="2" data-bind="checked:Test" />
<input type="radio" value="3" data-bind="checked:Test" />

默认选中第二个 radio 输入。在我点击第一个 radio 后,第一个和第二个都被选中。

enter image description here

更新: 当我同时包含 jQuery 和 knockout 时,就会发生这种情况。如果删除 jquery 则一切正常。 但它只是测试页。在实际项目中我需要在某些地方使用jQuery,在这种情况下我不能删除它。

Sample . 测试页来源:

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <script type="text/javascript" src="knockout-2.1.0.js"></script>
        <script type="text/javascript" src="jquery-1.6.4.js"></script>
        <script type="text/javascript">
            function Model(){
                self = this;
                self.Test = ko.observable(2);
                self.Test.subscribe(function (){
                  if (true) {
                     self.Test(2);
                  }
                });
            }
        </script>
    </head>
<body>
    <input type="radio" value="1" data-bind="checked:Test" />
    <input type="radio" value="2" data-bind="checked:Test" />
    <input type="radio" value="3" data-bind="checked:Test" />
</body>
<script type='text/javascript'>
    ko.applyBindings(new Model());
</script>
</html>

最佳答案

更新(2015 年 2 月 27 日):从 Knockout 3.1.0 开始,Knockout 不包含任何针对 click 事件的“解决方法”代码,处理问题。 http://jsfiddle.net/9S96U/3/


当包含 jQuery 时,Knockout 使用它来处理事件,包括用于响应单选按钮的 click 事件。它包含一些“解决方法”代码,以确保点击处理程序看到单选按钮的正确选中状态,但这似乎会干扰您尝试在中间重置选中值的代码。

解决方案是使用 setTimeout 更新值。这样它会在点击处理程序完成后发生。

function Model(){
    var self = this;
    self.Test = ko.observable(2);
    self.Test.subscribe(function (){
        setTimeout(function() {
            self.Test(2);
        });
    });
}

示例:http://jsfiddle.net/9S96U/1/

您还需要在 self = this 之前包含 var,这样您就不会覆盖 window.self

关于javascript - 如何更改订阅函数内部可观察值的值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13056146/

相关文章:

javascript - 使循环运行异步代码,但顺序正确

javascript - Angular-google-maps:圆形对象点击事件,如何在点击事件上向 Controller 发送信息?

Javascript 用 jQuery 函数替换函数

php - 通过 jQuery 设置表单值的任何缺点

javascript - 替换两个 JavaScript 注释之间的代码

javascript - JS Async/Await 不能与 forEach 结合使用

jquery - 如果我删除 Alert(),则选择标记不会在 ASP.Net 上使用 jquery 填充数据

javascript - 显示多个元素时性能不佳

javascript - JSON 与动态编码

javascript - Knockout JS 安全建议/开发工具