Why is this jQuery not working in IE?

I am working on a site created by someone else. They used the following jQuery code to create a dropdown menu:

        <script type="text/javascript">

            var site_menu_categories_tID = null;
            $(document).ready(
                function(){
                    $("#site-menu-categories").click(
                        function(){
                            self = $(this);
                            $(".submenu-holder").show();
                        }
                    );
                    $("#site-menu-categories").mouseleave(
                        function(){
                            site_menu_categories_tID = setTimeout(function(){
                                $(".submenu-holder").trigger('mouseleave');
                                clearTimeout(site_menu_categories_tID);
                                site_menu_categories_tID=null;
                            },500);
                        }
                    );
                    $(".submenu-holder").mouseenter(
                        function(){
                            if(site_menu_categories_tID!=null){
                                clearTimeout(site_menu_categories_tID);
                                site_menu_categories_tID=null;
                            }
                        }
                    );
                    $(".submenu-holder").mouseleave(
                        function(){
                            self = $(this);
                            self.hide();
                        }
                    );
                }
            );
        </script>

It works fine in firefox, but in none of IE (8 and below was not tested in 9). Are there any visible errors you can see?

+3
source share
1 answer

To avoid cluttering up the global area, get rid of the first self = $(this);and add varto the second or simply replace these two lines with$(this).hide();

IE doesn't seem to like it when you name a global variable self.

+4
source

All Articles