淘汰赛虚拟元素无法与Internet Explorer一起使用 [英] Knockout virtual elements not working with Internet Explorer

问题描述

如果您在Chrome中运行此Fiddle，则选择框会正确填充选项A，B和C.但是，如果您使用Internet Explorer(版本8或9)运行它，则它将无法工作.如何解决这个小提琴以使其可以与Internet Explorer一起使用，但仍使用虚拟元素?

If you run this Fiddle in Chrome, the select box is correctly filled with options A, B, and C. However, if you run it with Internet Explorer (version 8 or 9), it does not work. How can I fix this fiddle to make it work with Internet Explorer, but still use virtual elements?

http://jsfiddle.net/jeljeljel/2tUmP/

HTML

<script type="text/html" id="template">
    <select id="type" name="type">
        <option value="">-- Choose --</option>
        <!-- ko foreach: types -->
        <option data-bind="text: $data.desc, attr: { value: $data.id }"></option>
        <!-- /ko -->
    </select>
</script>
<div id="placeholder" data-bind="template: { name: 'template' }"></div>

JavaScript

function Model(){
    var self = this;
    self.types = ko.observable([]);
}
var model = new Model();
model.types().push({id: 0, desc:'A'});
model.types().push({id: 1, desc:'B'});
model.types().push({id: 2, desc:'C'});

ko.applyBindings(model);

推荐答案

这可能是Internet Explorer的局限性.

This is probably a limitation of Internet Explorer.

使用options绑定而不是虚拟元素来填充<select>元素:

Instead of a virtual element, use the options binding to populate a <select> element:

<select id="type" name="type"
    data-bind="options: types, optionsText: 'desc', optionsValue: 'id', optionsCaption: '-- Choose --'">
</select>

文档: http://knockoutjs.com/documentation/options-binding.html

这篇关于淘汰赛虚拟元素无法与Internet Explorer一起使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！