internet explorer - Javascript code doesn't work in IE only - Stack Overflow

admin管理员组

文章数量:1327962

I have just verified my javascript code works fine in all browsers except IE. How is it possible that the script is correctly read and executed in Chrome, Safari... but IE finds some inexplicable error and refuses to run the code?

$(document).ready(function() {
        var NewsNavigator = {

            init: function(config) {
                this.news = config.news;
                this.newsNum = this.news.length;
                this.navbuttons = config.navbuttons;
                this.prevButton = config.prevButton;
                this.nextButton = config.nextButton;
                this.displayatonce = config.displayatonce;
                this.maxSteps = Math.ceil(this.newsNum / this.displayatonce);
                this.counter = 0;
                this.navigateNews();
                this.enableNav();
                this.checkButtonsVisibility();

            },

            showNews: function() {
                var start = this.counter * this.displayatonce;
                var end = this.counter * this.displayatonce + (this.displayatonce - 1);
                for (i=start; i<=end; i++) {
                    this.news.eq(i).show();
                }

            },

            hideAllNews: function() {
                console.log("hiding news");
                this.news.hide();
            },

            navigateNews: function() {
                this.hideAllNews();
                this.showNews();
            },

            checkButtonsVisibility: function() {
                if (this.counter <= 0)
                {
                    this.prevButton.css('visibility', 'hidden');
                }
                else
                {
                    this.prevButton.css('visibility', 'visible');
                }

                if (this.counter >= this.maxSteps - 1) 
                {
                    this.nextButton.css('visibility', 'hidden');
                }
                else
                {
                    this.nextButton.css('visibility', 'visible');
                }
            },

            enableNav: function() {
                self = this;
                this.navbuttons.on('click', function(event) {
                    if (($(this).data('dir') === 'prev') && (self.counter > 0)) {
                        self.counter--;
                        self.navigateNews();
                    } else if (($(this).data('dir') === 'next') && (self.counter < self.maxSteps - 1)) {
                        self.counter++;
                        self.navigateNews();
                    }
                self.checkButtonsVisibility();
                event.preventDefault(); 
                });
            }
        };

        NewsNavigator.init({
            news: $('div#cat-news').find('div.oneCol'),
            displayatonce: 3,
            navbuttons: $('div#nav').find('a'),
            prevButton: $('div#nav a.prec'),
            nextButton: $('div#nav a.succ')
        });
});

Error message in IE9

SCRIPT438: The object doesn't support the 'checkButtonsVisibility' property or method.
NewsNavigator.js, Row 69 Character 5

I have just verified my javascript code works fine in all browsers except IE. How is it possible that the script is correctly read and executed in Chrome, Safari... but IE finds some inexplicable error and refuses to run the code?

$(document).ready(function() {
        var NewsNavigator = {

            init: function(config) {
                this.news = config.news;
                this.newsNum = this.news.length;
                this.navbuttons = config.navbuttons;
                this.prevButton = config.prevButton;
                this.nextButton = config.nextButton;
                this.displayatonce = config.displayatonce;
                this.maxSteps = Math.ceil(this.newsNum / this.displayatonce);
                this.counter = 0;
                this.navigateNews();
                this.enableNav();
                this.checkButtonsVisibility();

            },

            showNews: function() {
                var start = this.counter * this.displayatonce;
                var end = this.counter * this.displayatonce + (this.displayatonce - 1);
                for (i=start; i<=end; i++) {
                    this.news.eq(i).show();
                }

            },

            hideAllNews: function() {
                console.log("hiding news");
                this.news.hide();
            },

            navigateNews: function() {
                this.hideAllNews();
                this.showNews();
            },

            checkButtonsVisibility: function() {
                if (this.counter <= 0)
                {
                    this.prevButton.css('visibility', 'hidden');
                }
                else
                {
                    this.prevButton.css('visibility', 'visible');
                }

                if (this.counter >= this.maxSteps - 1) 
                {
                    this.nextButton.css('visibility', 'hidden');
                }
                else
                {
                    this.nextButton.css('visibility', 'visible');
                }
            },

            enableNav: function() {
                self = this;
                this.navbuttons.on('click', function(event) {
                    if (($(this).data('dir') === 'prev') && (self.counter > 0)) {
                        self.counter--;
                        self.navigateNews();
                    } else if (($(this).data('dir') === 'next') && (self.counter < self.maxSteps - 1)) {
                        self.counter++;
                        self.navigateNews();
                    }
                self.checkButtonsVisibility();
                event.preventDefault(); 
                });
            }
        };

        NewsNavigator.init({
            news: $('div#cat-news').find('div.oneCol'),
            displayatonce: 3,
            navbuttons: $('div#nav').find('a'),
            prevButton: $('div#nav a.prec'),
            nextButton: $('div#nav a.succ')
        });
});

Error message in IE9

SCRIPT438: The object doesn't support the 'checkButtonsVisibility' property or method.
NewsNavigator.js, Row 69 Character 5

• javascript
• internet-explorer

Share Improve this question Follow edited Jun 10, 2012 at 17:59 haunted85 asked Jun 10, 2012 at 17:28 haunted85haunted85 1,67177 gold badges2424 silver badges4040 bronze badges 6

• 2 We can't help without seeing your javascript. – Aidanc Commented Jun 10, 2012 at 17:29
• @haunted85 All browsers have their own subtle differences in the way JavaScript interacts with documents, as well as how much of ECMAScript (and which version) is implemented. You'll need to show us your code for further help. – Sampson Commented Jun 10, 2012 at 17:30
• Also make sure you don't have any object literals with mas right before a closing } – Pointy Commented Jun 10, 2012 at 17:30
• It is more then possible, I'd say its a typical situation :) as of ie 7 you have a developer console, where you can see which line of code fails. E.g. For me the IndexOf method failed for strings in IE, so I had to extend the string object in my code for it to work. You may find similar solution. – Alexander Gilmanov Commented Jun 10, 2012 at 17:36
• 2 Inexplicable errors are usually only inexplicable so long as they are kept secret from people who might explain them. – Quentin Commented Jun 10, 2012 at 17:37

 |  Show 1 more ment

2 Answers 2

Sorted by: Reset to default 3

Well this es down to the history of JavaScript.

JavaScript was implemented based on ECMAScript:

http://en.wikipedia/wiki/ECMAScript

Each and every single Web Browser provider (Mozilla, Google, Microsoft) decided that they didn't want to standardize JavaScript and they each came up with their own implementation of the ECMAScript, and thus their own JavaScript engine.

Thus, we programmers get a headache trying to write JavaScript that is patible across all these different JavaScript engines because each of them read JavaScript in their own way (which answers your question of why IE finds some inexplicable error while the rest doesn't)

Fun Fact: Only Mozilla's implementation of ECMAScript is actually called "JavaScript".

You should lookup on how to write JavaScript that is cross-patible across different JavaScript engines.

Use a javascript validation tool, such as JSLint to ensure maximum pability. This, since a single omitted character (such as ;, ', etc) can cause your script to not be run in specific browsers.

JSLint will also provide different tips on what do to and not to do to provide even further pability.

本文标签： internet explorerJavascript code doesn39t work in IE onlyStack Overflow