jQuery hasClass和动态添加的类

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);
            }
        }
    }
}

- Dwayne Charrington

Answer 1

你不需要在hasClass方法的参数中加上.。

修改为：

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

to

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

- Chandu

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);
  }

- jfriend00

Answer 3

hasClass 方法中不需要加点号。可以尝试这样写：

!pageEls.bigcol.hasClass('jspScrollable')

- FishBasketGordo