1

我有一个使用 Knockout.js 获取 ts 值的登录表单。

精简示例代码:

<input id="username" placeholder="Email" data-bind="textInput: Profile.Email" required />
<input id="password" type="password" placeholder="Password"  data-bind="textInput: Profile.Password" required />

var Profile = function () {
    self.Email = ko.observable('');
    self.Password = ko.observable('');
}

当密码管理器 Norton Identity Safe 等程序自动填充您的登录信息(我无法验证其他自动填充来源)时,Profile.Email 和 Profile.Password 的可观察项不会更新。如果我单击该框并赋予该字段焦点,然后离开该字段,则该值仍未更新。只有当我添加或删除一个字符时,该字段才会更新。

我在这里看到了一些关于如何“破解”解决此问题的其他线程,但它们都是 KO 3.2.0 之前的版本,其中包括textInput看起来应该解决此问题的绑定,但事实并非如此。

是否有任何理由为什么 textInput 没有更新自动填充上的可观察值,并且有任何新的方法来获取更新的值而不是那么“hacky”。

4

1 回答 1

1

除非change()触发触发器,否则 Knockout 不会看到更新的输入值。这是一个你可以玩的小演示。如果选中该复选框,则change在更新值后触发触发器,然后更改可观察值。

vm = {
  uname: ko.observable('initial'),
  changeIt: function() {
    var $el = $('#username').val('changed!');
    if (vm.doTrigger()) {
      $el.change();
    }
  },
  doTrigger: ko.observable(false)
};
ko.applyBindings(vm);

vm.uname.subscribe(function(newValue) {
  console.debug("Changed:", newValue);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<input id="username" data-bind="textInput: uname" />
<div data-bind="text:uname"></div>
<button data-bind="click:changeIt">Change It</button>
Trigger it: <input type="checkbox" data-bind="checked: doTrigger" />

另请参阅: 使用 jquery 更新字段不会更新 observable

于 2015-11-23T21:20:45.063 回答