Question

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

这是我的HTML：

mLeaderboardlist = new ArrayList<>();
...
String json = gson.toJson(mLeaderboardlist );

这是我的js：

<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>

我的小提琴在这里：

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

我试图遵循敲除关于禁用绑定的说明，他们说这与启用绑定完全相同，只是反过来：

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

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

非常感谢任何帮助。

Answer 1

这是一个非常简单的修复。您的apply绑定仅使用id chk1命中元素。 observable的值仅限于该范围。只需删除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>

Answer 2

你错过了jsFiddle的淘汰赛。

这是不正确的 ko.applyBindings(viewModel, document.getElementById("chk1"));。您需要将绑定应用于输入以及复选框。 ko.applyBindings(viewModel);

看到工作jsFiddle： https://jsfiddle.net/3ag0881z/4/

Answer 3

<input type="checkbox" data-bind="attr: { disabled: isDisabled}, checked: isActive" />

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

ko.applyBindings（视图模型）;

这是启用/禁用复选框，也适用于已选中/未选中

使用knockoutjs禁用绑定

3 个答案: