如何在select上创建绑定到数据文本字段？

Question

我有一个下拉列表，由选择元素初始化。

如何创建mvvm绑定到选定的数据文本字段？

我没有数据源。

<select id="size">
                <option value="1">S - 6 3/4"</option>
                <option value="2">M - 7 1/4"</option>
                <option value="3">L - 7 1/8"</option>
                <option value="4">XL - 7 5/8"</option>
</select>

我必须绑定到选定的文本。例如：M-7 1/4"和value

更新

Answer 1

您可以简单地绑定到的值

超文本标记语言：

<div id="bindme">
    <select id="size" data-bind="value: selectedValue">
        <option value="1">S - 6 3/4"</option>
        <option value="2">M - 7 1/4"</option>
        <option value="3">L - 7 1/8"</option>
        <option value="4">XL - 7 5/8"</option>
    </select>
    <div data-bind="text: selectedValue"></div>
    <div data-bind="text: selectedText"></div>
</div>

JS:

var viewModel = kendo.observable({
    selectedValue: 2,
    selectedText: function () {
        var value = this.get("selectedValue");
        var text = $('#size option[value="' + value + '"]').html();

        return text;
    }
});

kendo.bind($("#bindme"), viewModel);

见演示

还有其他方法可以做到这一点（这不是很漂亮，因为它与DOM结合在一起），例如使用自定义绑定或类似的方法。这取决于你的具体设置。