javascript - 使用knockoutjs禁用绑定(bind)

Question

我试图在选中复选框时禁用输入框。我正在尝试使用 Knockoutjs 来完成这项工作，但它似乎不起作用。

这是我的 html:

<input id="input1" type="text" placeholder="Something Here" 
data-bind="disable: makeInvalid"/>
<input type="checkbox" id="chk1" data-bind="checked: makeInvalid"/>
<label>Make Textarea Invalid</label>

这是我的js:

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

ko.applyBindings(viewModel, document.getElementById("chk1"));

我的 fiddle 在这里:

https://jsfiddle.net/devEngine/3ag0881z/2/

我已经尝试遵循 knockout 关于禁用绑定(bind)的说明，他们说这与启用绑定(bind)完全相同，只是相反:

http://knockoutjs.com/documentation/enable-binding.html

谁能告诉我我做错了什么？

如有任何帮助，我们将不胜感激。

Answer 1

这是一个非常容易修复的问题。您的应用绑定(bind)仅命中 ID 为 chk1 的元素。 observable 的值只会被绑定(bind)在那个范围内。只需删除 ko.applyBindings 的第二个参数，它就可以正常工作。

var viewModel = {
        makeInvalid : ko.observable(false),        
};
    
    ko.applyBindings(viewModel);

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>

<input id="input1" type="text" placeholder="Something Here" 
data-bind="disable: makeInvalid"/>
<input type="checkbox" id="chk1" data-bind="checked: makeInvalid"/>
<label>Make Textarea Invalid</label>