关于internet explorer：淘汰IE8兼容性问题


Knockout IE8 compatibility issue

在 IE9 上以 IE8 兼容模式运行时，我遇到了严重的淘汰问题。
这是问题：

我有一个动态生成的文本框数组，并且更改事件绑定到这些元素。当更改事件存在时，在 IE8 兼容模式下，我需要按两次 Tab 才能离开控件。这不会在 Firefox 中发生，也不会在没有事件绑定时发生。

我不确定这是否是我的活动的问题，所以我在这里发布代码：

1
2
3
4
5
6
7
8
9
10
11
  <tbody data-bind="foreach: DailyItemList">
                            <tr>
                                <td>
                                 <span  data-bind="text:Day"></span>

                                </td>
                                <td><input id="Text2" data-bind="value: Required"/></td>
                                <td><input id="Text3" data-bind="value: Setup, event:{change: ValidateSetup}"/></td>
                                <td><input id="Text4" data-bind="value: Close, event:{change: ValidateClose}"/></td>
  </tr>
  </tbody>

这是具有更改功能的视图模型：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
var DailyItem = function (data) {
this.Day = ko.observable(data.DayOfWeek);
this.Required = ko.observable(data.Required);
this.Setup = ko.observable(data.SetupTime);
this.Close = ko.observable(data.CloseTime);
this.ValidateSetup = function () {
    if (this.Setup() > 30) {
        alert('Invalid SetupTime');
    }
}
this.ValidateClose = function () {
    if (this.Close() > 30) {
         alert('Invalid SetupTime');
    }
}
}

function ViewModel(items) {
   this.DailyItemList = ko.observableArray([]);
   records = $.map(items, function (data) { return new DailyItem(data) });
   this.DailyItemList(records);
}
相关讨论

如果你想解决 IE8 的兼容性问题，那么你可以从你的 Validate 函数中返回 true。

1
2
3
4
5
6
7
this.ValidateSetup = function () {
    if (this.Setup() > 30) {
        alert('Invalid SetupTime');
    }

    return true;
}

这是一个示例：http://jsfiddle.net/rniemeyer/FfNqv/(jsFiddle 在 IE8 模式下本身存在一些问题，因此您可以运行 http://jsfiddle.net/rniemeyer/FfNqv/show/)

但更好的方法可能是使用手动订阅。当单个可观察对象发生更改时，这是执行代码的好选择。 computed 也可以这样做，这允许您依赖多个可观察对象。

通过手动订阅，您可以：

1
<input id="Text3" data-bind="value: Setup"/>

在你的视图模型中，你会这样：

1
2
3
4
5
6
7
8
9
this.Close = ko.observable(data.CloseTime);
this.Close.subscribe(function(newValue) {
    if (newValue > 30) {
        alert('Invalid SetupTime');
    }

    //set other observables, or do whatever you like."this" will be the this object.

}, this);
相关讨论