当使用atout类型使用knockout进行数据绑定时,IE8抛出“不支持此命令”错误

时间:2013-08-14 18:59:29

标签: javascript knockout.js

代码: -

<html>
    <head>
    <script type="text/javascript" src="http://knockoutjs.com/downloads/knockout-2.3.0.js"></script>
    </head>
    <body>
    <table>
        <thead>
            <tr>
                <th>Name</th>
                <th>InputType</th>
            </tr>
        </thead>
        <tbody data-bind="foreach: settings">
            <tr>
                <td data-bind="text: name"></td>
                <td><input data-bind="attr: {type: dtype}"/></td>
            </tr>
        </tbody>
    </table>
    <script type="text/javascript">
    var viewModel = function(){
        this.settings = ko.observableArray([{name: "Bungle",dtype:"text"},{name: "George",dtype: "checkbox"},{name: "Zippy",dtype:"text"}]);
    };

ko.applyBindings(new viewModel());
</script>
</body>
</html>

以上代码也在小提琴http://jsfiddle.net/uByVQ/中捕获。虽然,在小提琴中捕获的场景在Chrome中运行良好但在IE8中无法正常运行。我收到了错误

“不支持此命令”。

我正在使用淘汰赛2.3

任何人都可以指点我的工作吗?

感谢。

1 个答案:

答案 0 :(得分:5)

似乎在IE中,一旦将输入元素添加到DOM中,就无法更改输入元素的类型。

  

type属性是read / write-once,但仅在使用createElement方法创建输入元素时以及在将其添加到文档之前。

http://msdn.microsoft.com/en-us/library/ms534700.aspx

有一些丑陋的解决方法涉及创建一个新元素并删除现有元素,但你必须编写一个自定义的淘汰赛绑定器才能实现这一点。

您可以使用if binding

解决这个问题
<tr>
    <td data-bind="text: name"></td>
    <td>
        <span data-bind="if: dtype=='checkbox'"><input  type='checkbox' /></span>
        <span data-bind="if: dtype=='text'"><input  type='text' /></span>
    </td>
</tr>

请参阅:http://jsfiddle.net/GQEs5/

但这真的令人不满和冗长。

我还要补充一点,它在哲学上不具备在你的模型中的演示细节,但我绝对认识到你的方法的实用好处。