jQuery动画在IE8中不起作用

Question

I have used HighChart JS for creating a chart. My only change to it was to create the animation for each series in the chart.

All went well, but only problem is that it doesn't work in IE8. It works in IE9, IE10 and in all other sane browsers.

I created a fiddle here and will be thankful if you can take a look.

http://jsfiddle.net/DUvQW/

This is what I wrote and where I created the timed animation:-

 chart: {
            type: 'bubble',
            width: 650,
            height: 450,
            zoomType: 'xy',
            events: {
                load: function (event) {

                    this.series.forEach(function (d, i) {
                        if (d.options.id == 1) {
                            setTimeout(function () {
                                d.show();
                            }, 100);

                        }
                        if (d.options.id == 2) {
                            setTimeout(function () {
                                d.show();
                            }, 1000);
                        }
                        if (d.options.id == 3) {
                            setTimeout(function () {
                                d.show();
                            }, 2000);
                        }
                        if (d.options.id == 4) {
                            setTimeout(function () {
                                d.show();
                            }, 3000);
                        }
                        if (d.options.id == 5) {
                            setTimeout(function () {
                                d.show();
                            }, 4000);
                        }
                        if (d.options.id == 6) {
                            setTimeout(function () {
                                d.show();
                            }, 5000);
                        }
                    })

                }
            }
        },
        . . . 

Answer 1

IE 8 does not support the .forEach() iterator for arrays. You can either switch to the for (var i = 0; i < array.length; i++) method of iterating arrays or you can install a polyfill for .forEach() . See this MDN page for the polyfill.

If you switch to a regular for loop, then you will also have to use an IIFE (immediately executing function expression) to capture a unique value for d for each iteration of the loop like here: http://jsfiddle.net/jfriend00/yMRP8/

Or, you can add the polyfill for .forEach() as shown here to add support for it in IE8: http://jsfiddle.net/jfriend00/6kybR/ . The jsFiddle will not work in IE8 because jsFiddle itself does not support IE8. You will have to test the polyfill in IE8 in your own actual code.