1

所以我有一个包装输入的标签。我有一个绑定到标签的点击事件，以及绑定到输入更改的另一个函数。这些需要是单独发生的事情（还有其他可以改变值的事情，但我不希望点击处理程序为这些事情触发）。

点击按预期触发，但值永远不会改变，更不用说触发关联的函数了。

vm.hasBeenClicked = ko.observable(false);
vm.currentValue = ko.observable('default');

vm.onLabelClick = function(){
  vm.hasBeenClicked(true);
  //fires no problem
}

vm.currentValue.subscribe(function(){
  //this never fires
});

和html：

<label data-bind="click: onLabelClick">
  <input type="radio" data-bind="value: currentValue" />
</label>
4

1 回答 1

1

首先，您需要将“已检查”绑定与单选和复选框一起使用，而不是“值”。您还需要添加return true;到 onLabelClick 函数，以便标签事件不会与单选控件本身的单击事件发生冲突。

var vm = {};

vm.hasBeenClicked = ko.observable(false);
vm.currentValue = ko.observable('default');

vm.onLabelClick = function(){
  vm.hasBeenClicked(true);
  //fires no problem
  return true;
}

vm.currentValue.subscribe(function(){
  console.log("updated");
});

ko.applyBindings(vm);
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>


<label data-bind="click: onLabelClick">
  option 1
  <input type="radio" value='option 1' data-bind="checked: currentValue" />  
</label>
<label data-bind="click: onLabelClick">
  option 2
  <input type="radio" value='option 2' data-bind="checked: currentValue" />
</label>

<br/>
clicked: <span data-bind="text: ko.toJSON(hasBeenClicked)"></span>
<br/>
value: <span data-bind="text: ko.toJSON(currentValue)"></span>

于 2018-05-04T17:11:00.517 回答