如何限制选择列表-在KnockoutJS中仅选择一项

时间:2018-08-11 08:36:49

标签: jquery css list select knockout.js

如何限制选择列表仅选择一项? 可以通过CSS完成吗?

<select multiple data-bind="options: Items,             
                   optionsText: 'Title',
                   value: selectedItems, optionsValue: 'Id',
                   attr: { name: 'item' }"></select>


<div data-bind="text: selectedItems"></div>



function ViewModel() {
    var self = this;  
    var    selection = [];
    self.selectedItems = ko.observableArray();
    self.Items = ko.observableArray([{"Id": "0",  "Title": "Item1"}, 
    { "Id": "1", "Title": "Item2"}, { "Id": "2", "Title": "Item3"}]);    
}

ko.applyBindings(new ViewModel());

http://jsfiddle.net/s95wezu2/1/

1 个答案:

答案 0 :(得分:0)

我不确定您的要求。您可以使用size属性代替multiple。这将限制用户选择多个选项,但将显示所有选项。

function ViewModel() {
    var self = this;  
    var    selection = [];
    self.selectedItems = ko.observableArray();
    self.Items = ko.observableArray([{"Id": "0",  "Title": "Item1"}, 
    { "Id": "1", "Title": "Item2"}, { "Id": "2", "Title": "Item3"}]);    
}

ko.applyBindings(new ViewModel());
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<select size = 3 data-bind="options: Items,             
                   optionsText: 'Title',
                   value: selectedItems, optionsValue: 'Id',
                   attr: { name: 'item' }"></select>


<div data-bind="text: selectedItems"></div>

您不需要CSS。