Question

我仅在移动设备上收到以下错误

Uncaught TypeError: Cannot read property 'replace' of undefined
    at window.onscroll

以下是导致错误的代码

 <script type="text/javascript">
  $(document).ready(function () {
    window.onscroll = function() { 
       var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
       if (w<660) { 
       var element = $('#livechat-compact-container');
         element.attr('style', element.attr('style').replace(/bottom:[^;]+/g, ''));
         $('#livechat-compact-container').css('bottom','50px');
       }
   };
  });
</script>

具有id＃livechat-compact-container的元素确实存在，所以我不确定为什么它将是未定义的并且仅在移动设备上显示此错误。

Answer 1

这是因为，documentation表示

从jQuery 1.6开始，.attr()方法为尚未设置的属性返回undefined。

所以问题不在于找到元素，而是设置了style属性。

但重要的是，您不必从style属性中删除bottom。只需设置其新值即可完成。

if (w<660) { 
     var element = $('#livechat-compact-container');
     element .css('bottom','50px');
}

Answer 2

很确定这对你有用：

第一。向上移动var element = $('#livechat-compact-container');

第二。将您的if更新为if (w < 660 && element)：

<script type="text/javascript">
  $(document).ready(function() {
    window.onscroll = function() {
      var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
      var element = $('#livechat-compact-container');
      if (w < 660 && element) {
        $('#livechat-compact-container').css('bottom', '50px');
      }
    };
  });
</script>

Answer 3

让jQuery进行样式更改，只需使用：

element.css({'bottom': '50px'});

在您的代码中：

window.onscroll = function() { 
    var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
    if (w<660) { 
        var element = $('#livechat-compact-container');
        element.css({'bottom': '50px'});
    };
};

jQuery css() method将：

为每个匹配的元素设置一个或多个CSS属性

因此，如果没有element，则没有匹配，没有错误。

无法读取＆＃39;替换＆＃39;在window.onscroll中未定义的

3 个答案: