$(window).load(function() 并不总是有效

Question

我正在尝试在我的网站上的 div 上实施 scrollbar plugin，但我遇到了一些问题。首先它应该是这样工作的：

jQuery(document).ready(function ($) {
    "use strict";
    $('.chat-messages').perfectScrollbar({suppressScrollX: true});
  });

但我只能让它这样工作:

$(window).load(function() {
    "use strict";
    $('.chat-messages').perfectScrollbar({suppressScrollX: true});
});

但是对于 window.load 脚本似乎并不总是有效，或者至少滚动条并不总是出现。

我不是很熟悉 js 或 jquery 但我将 src 文件 perfect-scrollbar.js 插入到一个文件夹中，我通常这样调用它： <script src="http://domain.com/javascript/perfect-scrollbar.js"></script> 在header 并将我上面用 window.load 描述的代码紧跟在 <script></script> 之间。我假设这与另一个准备好的文档有冲突，所以我在网上搜索解决方案和其他加载它的方法，我发现没有冲突，并尝试像这样实现：

$.noConflict();
jQuery( document ).ready(function( $ ) {
     "use strict";
   $('.chat-messages').perfectScrollbar({suppressScrollX: true});
   });
});

但仍然没有结果，唯一的作用就是停止网站的所有 jquery 工作。谁能帮我这个？提前致谢

Answer 1

的问题

jQuery(document).ready(function ($) {
    "use strict";
    $('.chat-messages').perfectScrollbar({suppressScrollX:    true});
});

是您通过使用该标识符命名匿名函数的参数而在本地范围内留下 $ 未定义。 jQuery 不向该函数传递任何参数，但您的参数声明掩盖了 $ 的全局定义。如果您没有使用无冲突模式，那么 $ 将在全局范围内可用，因此以下内容应该有效：

$(document).ready(function () {
    "use strict";
    $('.chat-messages').perfectScrollbar({suppressScrollX: true});
});

顺便说一句，noConflict 的目的是避免与可能依赖于 $ 的全局定义的其他代码发生冲突，这不同于 jQuery 对 [=12= 的使用] 作为 jQuery.

的别名

Answer 2

我已经测试过，document.ready 应该可以正常工作。

CSS

.chat-messages {
    position: fixed;
    height: 300px;
    overflow: hidden;
}

编辑：

由于您将此与其他脚本结合使用，可以尝试在最顶部将您的选择器声明为变量。

JQuery

$(function () {
    var $chat = $('.chat-messages');

    ...other scripts/functions... 

    $chat.perfectScrollbar({suppressScrollX: true});
});

这里是Fiddle.

Answer 3

非常感谢你们的帮助，我在这里找到了这个解决方法：[src]

var visible = true;
setInterval(
function()
{
    if(visible)
        if($('#element').not(':hidden'))
        {
            visible = false;
            "use strict";
            $('.chat-messages').perfectScrollbar({suppressScrollX: true});
        }
    else
        if($('#element').is(':hidden'))
        {
            visible = true;
            // do something
        }
}, 1000);

$(window).load(function() 并不总是有效

$(window).load(function() not always working

html

javascript

jquery

perfect-scrollbar