HTML 多选更改“未选择”文本

debugcn 发表于 Dev

达娜

我有一个带有多选选项的选择列表：

<select data-bind="attr:{'id':'multilistS'+Id()},foreach: Hlist" multiple="multiple">
     <option data-bind="click:$root.changeShole,value:$data.Id, text:N,attr:{'selected':$data.Sel}">Cheese</option>
</select>

但我想更改“未选择”文本。可以使用nonSelectedText选项在 HTML 代码中或仅在 JavaScript 中执行此操作吗？

罗伊

您真的应该采纳 John Pavek 的建议来阅读选项绑定。Knockout 专门为此提供了很好的工具，而您的构建没有使用它们。

noneselectedtext似乎是jQuery-UI 多选小部件的一个功能。如果您正在使用它，那么您将需要为其使用绑定处理程序。

这是您描述的一个简单示例，其中的消息会根据是否选择了多选中的任何内容而发生变化。

const vm = {
  optionsCaption: ko.pureComputed(function() {
    return (vm.selectedOptions().length === 0) ? 'Please select at least one' : 'ok';
  }),
  selectedOptions: ko.observableArray([]),
  Hlist: ko.observableArray([{
    Id: 1,
    N: 'One'
  }, {
    Id: 2,
    N: 'Two'
  }])
};

ko.applyBindings(vm);

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<div data-bind="text: optionsCaption"></div>
<select data-bind="options: Hlist, optionsText: 'N', optionsValue: 'Id', selectedOptions: selectedOptions" multiple="multiple">
</select>
<div data-bind="foreach: selectedOptions">
  <div data-bind="text:$data"></div>
</div>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。