Html:
<select id="days" multiple="multiple" data-placeholder="Select days...">
<option value="Monday">Monday</option>
<option value="Tuesday">Tuesday</option>
<option value="Wednesday">Wednesday</option>
<option value="Thursday">Thursday</option>
<option value="Friday">Friday</option>
<option value="Saturday">Saturday</option>
<option value="Sunday">Sunday</option>
</select>
Javascript:
$("#days").kendoMultiSelect({
autoClose: false
});
var days = $("#days").data("kendoMultiSelect");
如何确定是否选择了特定项目?例如,我如何知道用户是否选择了星期五?
请注意,我可以在此处选择多个项目。
没有API方法来检查是否选择了特定项目,但您可以轻松创建一个,例如:
kendo.ui.MultiSelect.fn.isSelected = function (key) {
var selectedItems = this.value();
return selectedItems.indexOf(key) > -1;
};
然后你可以这样使用:
$("#days").kendoMultiSelect({
autoClose: false
});
var days = $("#days").data("kendoMultiSelect");
$("#button").click(function() {
console.log("is it friday?", days.isSelected("Friday"));
});
查看dataItems((函数:
http://docs.telerik.com/kendo-ui/api/web/multiselect#methods-dataItems
然后你可以像这样迭代选择的项目:
days.dataItems().forEach(function(element, index, array) {
//dataItems() returns the selected items
// Work on each element, element.value
});
这是一个jsbin:
http://jsbin.com/vijiq/1/edit?html,js,输出
您可以试试switch
。
var day = document.getElementById("days").value;
switch(day) {
case "Monday":
yourFunction();
break;
case "Tuesday":
anotherFunction();
break;
... etc.
}
好吧,试试这样的吧?请注意。
var days = [];
var options = document.querySelectorAll("#days option");
var i = 0, length = options.length;
for (i; i < length; i++) {
if (options[i].selected) {
days.push(options[i].value);
}
}
alert(days);