Question

我正在使用一个名为JS Scrollpane的jQuery自定义滚动条库，但是在尝试将滚动条应用于已经有滚动条的DIV时会出现意外结果。所以我要检查的是是否已应用类“.jspScrollable”，如果是，则不应用滚动条。很简单，对吧？

类“.jspScrollable”由脚本动态添加，似乎jQuery的hasClass方法是静态的而不是动态的，所以它没有看到添加了新的类。有没有办法可以检查何时将动态类添加到元素中？

不介意pageEls.bigcol行。这只是一个小对象，我存储了所有选择器以优化我的代码，因为该网站目前有大约4000行JS左右。

到目前为止，这是我的代码：

function initScrollers()
{
    pageEls.bigcol = $(".bigcol").filter(':visible');

    var settings = {
        animateScroll: true,
        autoReinitialise: true,
        hideFocus: true,
        verticalGutter: 15
    };

    if ( pageEls.bigcol.length && !pageEls.bigcol.hasClass('noScroller') ) 
    {
        if ( !pageEls.bigcol.hasClass('.jspScrollable') )
        {
            if (pageEls.bigcol.height() > 290)
            {
                pageEls.bigcol.jScrollPane(settings);
            }
        }
    }
}

Answer 1

.方法参数中不需要hasClass。

变化：

 if ( !pageEls.bigcol.hasClass('.jspScrollable') )

到

 if ( !pageEls.bigcol.hasClass('jspScrollable') )

Answer 2

拿走。关闭hasClass()参数中的类名。它应该只是：

 if ( !pageEls.bigcol.hasClass('jspScrollable') )

在这里使用jsFiddle：http://jsfiddle.net/jfriend00/TsfQ6/

$("#test").addClass("testClass");
alert($("#test").hasClass("testClass"));   // alerts true

顺便说一下，你可以将你的三重嵌套if语句折叠到：

  if ( pageEls.bigcol.length && 
       !pageEls.bigcol.hasClass('noScroller') &&
       !pageEls.bigcol.hasClass('.jspScrollable') &&
       pageEls.bigcol.height() > 290 )  
  {
      pageEls.bigcol.jScrollPane(settings);
  }

Answer 3

您不需要hasClass中的点。试试这个：

!pageEls.bigcol.hasClass('jspScrollable')

jQuery .hasClass和动态添加的类

3 个答案: