Question

我正在使用以下在网上找到的JS来实现响应式导航。关于在IE8中有任何错误，源代码没有任何内容，但是我在BrowserStack（Win7 + IE8）中进行了一些兼容性测试，并且得到了“Object不支持此属性或方法”错误。这是整个脚本：

<script>
$(function() {  
    var pull        = $('#menu');  
        menu        = $('nav ul');  
        menuHeight  = menu.height();  

    $(pull).on('click', function(e) {  
        e.preventDefault();  
        menu.slideToggle();  
    });  
});  

$(window).resize(function(){  
    var w = $(window).width();  
    if(w > 320 && menu.is(':hidden')) {  
        menu.removeAttr('style');  
    }  
});
</script>

这是IE8不喜欢的那条线（具体是字符6）：

if(w > 320 && menu.is(':hidden')) {

解决这个问题的任何帮助都很棒，我仍然不是JS的最佳人选。

Answer 1

我希望您意识到单个var语句并不适用于所有变量。您正在声明全局变量。

Answer 2

完全停止在globals中存储jQuery对象。根据需要创建它们并不会花费太多，而且您不会遇到这样的生命/范围问题：

<script>
$(function() {  
    $('#menu').on('click', function(e) {  
        e.preventDefault();  
        $('nav ul').slideToggle();  
    });  
});  

$(window).resize(function(){  
    var menu = $('nav ul'); 
    if($(window).width() > 320 && menu.is(':hidden')) {  
        menu.removeAttr('style');  
    }  
});
</script>

这里适用的一些通用设计/代码布局思路：

尽可能避免使用全局变量。
不要在一个范围内声明某些内容，然后尝试在另一个范围内使用它（除非全局所以看到规则＃1，否则不会工作）以及全局可能还有时间问题。
仅在消耗它们的函数中需要时获取选择器结果。在函数的生命周期之外，很少有理由缓存这样的东西。
如果要在函数中多次引用相同的jQuery对象，那么您可能希望在函数期间将其保存到局部变量中（只要其结果不会成为＆＃39; t在功能中修改。）。

IE8 JS错误：对象不支持此属性或方法

2 个答案: