使用 jquery 更新字段不会更新 observable答案

【问题标题】：Update field with jquery don't update observable使用 jquery 更新字段不会更新 observable
【发布时间】：2012-03-29 01:04:46
【问题描述】：

我想向 stackoverflow 社区问好。

我几天前才开始使用淘汰赛。

我知道我正在使用它为我正在开发的 CMS 制作动态菜单构建器。

这里是代码：http://jsfiddle.net/dnlgmzddr/HcRqn/

问题是当我从选择框中选择一个元素时，输入字段会按我的预期更新，但 observable 并没有反映变化。因此，添加按钮未启用。

我错过了什么？我该如何解决？

谢谢。

【问题讨论】：

标签： javascript jquery knockout.js

【解决方案1】：

当您填充 url 字段时，您需要触发 change 事件以使 observable 被更新。所以，你可以这样做：

$("#url").val('/pages/' + id).change();

另一个更符合 Knockout 精神的选项是在您的选择上使用绑定。在这种情况下，您可能希望使用该值填充 observable，然后使用手动订阅将格式化值默认为输入字段。

this.itemUrl = ko.observable();
this.selectedUrl = ko.observable();
this.selectedUrl.subscribe(function(newValue) {
    if (newValue) {
        this.itemUrl("/pages/" + newValue);                
    }
}, this);

然后，将您的选择绑定到selectedUrl：

    <select id="pagedList" data-bind="value: selectedUrl">
        <option value=""><option>
        <option value="test">Test</option>
    </select>

这是一个示例：http://jsfiddle.net/rniemeyer/HcRqn/21/

如果您的选项的“价值”是 url，您还可以消除额外的可观察和手动订阅。

【讨论】：

【解决方案2】：

我在您的代码中看不到您在选择字段时实际启用按钮的任何地方。所以我可能会遗漏一些东西，但只需启用更改按钮即可。像下面这样：

function LoadMenu() {
    $("#pagedList").change(function () {
        var id = $(this).val();
        $("#url").val('/pages/' + id);
        // remove the disabled attribute here
        $('button.space').removeAttr('disabled');
    });
}

【讨论】：