Question

我正在研究一个非常古老的遗产项目。在这个项目中包含了一个非常古老的JQuery版本（1.2.3版本）。我无法改变JQuery版本。

我发现以下操作有些困难。

在我的脚本中，我必须检查特定元素是否设置了某个CSS类，所以在我的代码中我有这样的东西：

var theadElement = $(this);

if(theadClass.hasClass('active')) {
    alert("THEAD ACTIVE");
}else {
    alert("THEAD NOT ACTIVE");
}

所以 theadElement 包含从我的DOM中检索到的 thead 标记的引用（这很好），我必须检查这个 thead tag已经设置了一个名为活动的CSS类。

我尝试使用 hasClass（）函数，如下所示：Jquery: How to check if the element has certain css class/style

但是当它尝试执行 hasClass（）功能时，它无法工作，我在FireBug控制台中获得以下错误消息：

TypeError: theadClass.hasClass is not a function
http://localhost:7001/wea-web/edi.do?serv=8.2
Line 47

所以我认为问题可能是JQuery 1.2.3版本太旧而且此版本中没有实现 hasClass（）功能。

如何以其他方式解决此问题？如何检查所选元素上是否设置了活动 CSS类？

EDIT-1：这是我的整个脚本：

    $(document).ready(function () {
        $("thead.opening").click(function () {

            alert("INTO FIRST FUNCTION !!!");
            //alert($(this).next().css('display'));

            var theadElement = $(this);
            var tbodyElement = $(this).next();

            alert("THEAD TAG BEFORE: " + theadElement.attr('tagName'));
            var theadClass = theadElement.attr('class');
            alert("CLASS THEAD BEFORE: " + theadClass);

            $(this).next().slideToggle('slow', function () {
                $(this).prev("thead.opening").toggleClass("active");
                $("thead.opening").find(".imgAccordion").attr("src", "img/arrow.gif");
                $("thead.active").find(".imgAccordion").attr("src", "img/arrow_down.gif");

                alert("THEAD TAG AFTER: " + theadElement[0].tagName);

                // Retrieve the class of the clicked thead element in the DOM:
                var theadClass = theadElement.attr('class');
                alert("CLASS THEAD AFTER: " + theadClass);

                if(theadClass.attr('class').match(/active/)) {
                    alert("THEAD ACTIVE");
                }
                else {
                    alert("THEAD NOT ACTIVE");
                }
            });
            return false;
        });

TNX

Answer 1

您的变量名称不同：

<强> theadElement

<强> theadClass

无论如何，您可以在dom中获取节点的className属性。 var hasClass =（threadElement [0] .className.search（/（^ | \ s）myClass（\ s | $）/）！== -1）

Answer 2

您可以尝试使用：

theadClass.attr('class').match(/active/)

Answer 3

你可以完全跳过jQuery并使用vanilla JS：

if (/\s?active\s?/.test(this.className)) {
    // your code here
}

Answer 4

if(theadClass.attr('class').indexOf('active') !== -1){
    alert("THEAD ACTIVE");
}else {
    alert("THEAD NOT ACTIVE");
}

你确定theadClass引用了jqueryObject吗？只需要执行threadclass.attr（'class'），如果你得到了正确的结果，那么它有一个jqueryObject，如果不是你也需要查看它！

Answer 5

根据this，hasClass是在JQuery 1.2.3版本中实现的......

我认为问题是你试图在一个不再是jQuery对象的对象上调用jQuery函数。

Answer 6

如果你没有“hasClass”方法，你可以随时从较新版本的jQuery“窃取”该方法并在你的代码中实现它。

function (a){for(var b=" "+a+" ",c=0,d=this.length;d>c;c++)if(1===this[c].nodeType&&(" "+this[c].className+" ").replace(uc," ").indexOf(b)>=0)return!0;return!1}

是最新的hasClass实现，您可以扩展您的jQuery以包含它。如果您更喜欢单独使用jQuery，您也可以使用单独的函数，无论您希望在何处使用：

function hasClass( target, className ) {
    return new RegExp('(\\s|^)' + className + '(\\s|$)').test(target.className);
}

上面的那个应该与浏览器兼容！

为什么我无法检查HTML元素（从DOM检索）是否使用JQuery设置了特定的CSS类？

6 个答案: