Javascript 使用KendoMulti Select时如何获取选项标记的文本_Javascript_Html_Kendo Ui

Javascript 使用KendoMulti Select时如何获取选项标记的文本

javascript html kendo-ui

Javascript 使用KendoMulti Select时如何获取选项标记的文本,javascript,html,kendo-ui,Javascript,Html,Kendo Ui,使用KendoMulti选择框时如何获取选项标记的文本？当前使用的.value为我提供了选项标记的value属性上面的示例取自并编辑自使用javascript、document.getElemntById.options[index]和InnerHTML，如下所示已编辑：要选择全部，可以使用javascript数组绑定所有记录，并使用连接操作打印为单个文本。。如下 <!DOCTYPE html> <html> <head> <base hre

使用KendoMulti选择框时如何获取选项标记的文本？当前使用的.value为我提供了选项标记的value属性

上面的示例取自并编辑自

使用javascript、document.getElemntById.options[index]和InnerHTML，如下所示

已编辑：要选择全部，可以使用javascript数组绑定所有记录，并使用连接操作打印为单个文本。。如下

<!DOCTYPE html>
<html>
<head>
    <base href="http://demos.telerik.com/kendo-ui/multiselect/index">
    <style>html { font-size: 12px; font-family: Arial, Helvetica, sans-serif; }</style>
    <title></title>
    <link href="http://cdn.kendostatic.com/2014.2.903/styles/kendo.common.min.css" rel="stylesheet" />
    <link href="http://cdn.kendostatic.com/2014.2.903/styles/kendo.default.min.css" rel="stylesheet" />
    <link href="http://cdn.kendostatic.com/2014.2.903/styles/kendo.dataviz.min.css" rel="stylesheet" />
    <link href="http://cdn.kendostatic.com/2014.2.903/styles/kendo.dataviz.default.min.css" rel="stylesheet" />
    <script src="http://cdn.kendostatic.com/2014.2.903/js/jquery.min.js"></script>
    <script src="http://cdn.kendostatic.com/2014.2.903/js/angular.min.js"></script>
    <script src="http://cdn.kendostatic.com/2014.2.903/js/kendo.all.min.js"></script>
</head>
<body>
    <div id="example" role="application">
    <div class="demo-section k-header">
        <h2>Invite Attendees</h2>
        <label for="required">Required</label>
        <select id="required" multiple="multiple" data-placeholder="Select attendees...">
            <option value="1">Steven White</option>
            <option value="2">Nancy King</option>
            <option value="3">Nancy Davolio</option>
            <option value="4">Robert Davolio</option>
        </select>
        <label for="optional">Optional</label>
        <select id="optional" multiple="multiple" data-placeholder="Select attendees...">
            <option>Steven White</option>
            <option>Nancy King</option>
            <option>Nancy Davolio</option>
        </select>
        <button class="k-button" id="get">Send Invitation</button>
    </div>
    <script>
        $(document).ready(function() {
            // create MultiSelect from select HTML element
            var required = $("#required").kendoMultiSelect().data("kendoMultiSelect");
            var optional = $("#optional").kendoMultiSelect().data("kendoMultiSelect");

            $("#get").click(function() {
                alert("Attendees:\n\nRequired: " + required.value() + "\nOptional: " + optional.value());
            });
        });
    </script>
</div> 
</body>
</html>

我赞成你的答案，但当我使用multi-select时，它不会选择AllUpdate！检查一下

 $(document).ready(function() {
            // create MultiSelect from select HTML element
            var required = $("#required").kendoMultiSelect().data("kendoMultiSelect");
            var optional = $("#optional").kendoMultiSelect().data("kendoMultiSelect");

            var Element= document.getElementById("required");

            $("#get").click(function() {

                 var arr = new Array()
                 for (var i = 0; i < required.value().length; i++) {
                      arr.push(Element.options[required.value()[i] - 1].innerHTML);
                 }

                 alert("Attendees:\n\nRequired: " +arr.join() + "\nOptional: " + optional.value());
            });
        });