如何在jquery中从'this'引用获取类名

时间:2016-05-26 09:39:52

标签: jquery class jquery-selectors

我想知道如何从this引用中获取元素的类名。 我有以下HTML元素

<input type="checkbox" class="NotSelected @placeholderString" onchange="SaveCompairedOffers(this);">

jQuery代码

function SaveCompairedOffers(obj) {
    //Hiding irrelevant code from here

    AddCompareOfferInCompareBox();
}

在AddCompareOfferInCompareBox函数中,我想在compare-box类附加对象的类名。

function AddCompareOfferInCompareBox()
{
    var innerHtml = "";
    $('.SelectedOffer').each(function () 
        //append class name of current passed object to this div
        innerHtml = innerHtml + '<div class="compare-box"></div>';
    });
    $(".AddCompareOfferByMe").html(innerHtml);
}

我该怎么做?

3 个答案:

答案 0 :(得分:1)

我建议您使用data-*前缀属性来存储任意数据。

<input type="checkbox" class="NotSelected" data-str="@placeholderString" onchange="SaveCompairedOffers(this);">

可以使用HTMLElement.dataset属性

获取此内容
  

HTMLElement.dataset属性允许在读取和写入模式下访问元素上设置的所有自定义数据属性(data- *)。它是DOMString的映射,每个自定义数据属性都有一个条目。

function SaveCompairedOffers(obj){
   var str =  obj.dataset.str;
   AddCompareOfferInCompareBox(str );
}

function AddCompareOfferInCompareBox(str)   {       
    $('.SelectedOffer').each(function () 
        $('<div></div>', {
           "class" : "compare-box " + str
        }).appentTo(".AddCompareOfferByMe");        
    });
}

但是,如果您仍想使用类名,则可以使用Element.className属性。

  

className获取并设置指定元素的class属性的值。

使用

function SaveCompairedOffers(obj){
   var str =  obj.className;
}

答案 1 :(得分:1)

最简单的方法是vanilla javascript。在您希望引用this的函数中,添加以下代码以将类分配给变量:

var classes = this.className

如果要获取所有类的数组,可以使用split()函数实现此目的,如下所示:

var classes = this.className.split(' ')

答案 2 :(得分:0)

要回答实际问题,如何从jQuery引用中获取分配给对象的css类,请尝试:

var elementClass = ($(myselector).prop('className');