Bug Tracker

#13949 closed feature (plugin)

Opened May 27, 2013 12:14PM UTC

Closed May 27, 2013 06:19PM UTC

Last modified September 07, 2013 03:25PM UTC

Multiple arguments support in hasClass

Reported by: hasanokan@gmail.com Owned by:
Priority: undecided Milestone: None
Component: unfiled Version: 1.9.1
Keywords: Cc:
Blocked by: Blocking:
Description

Sometimes, we need to check multiple class with hasClass,

if ( $el.hassClass("class1") && $el.hasClass("class2") && ...) {
  //Yes It does
}

It would be great if supports multiple classNames like

{{{

if ( $el.hasClass("class1, class2, class3") ) {

//Yes It does

}

Attachments (0)
Change History (5)

Changed May 27, 2013 03:46PM UTC by anonymous comment:1

Actually it does support multiple classes just yet:

if ($el.hasClass("class1 class2 class3")) {

//Yes It does

}

Changed May 27, 2013 04:06PM UTC by m_gol comment:2

#13948 is a duplicate of this ticket.

Changed May 27, 2013 06:14PM UTC by m_gol comment:3

_comment0: `hasClass` doesn't support multiple classes, its behavior on input with multiple classes is unspecified: \ {{{ \ $('<div>').addClass('a b').hasClass('a b') \ true \ $('<div>').addClass('a b').hasClass('b a') \ false \ }}} \ I'm against such a change, it's not obvious if `hasClass('class1 class2')` is supposed to mean that element has all of those classes set or at least one of them. If you really need it, you can define a very small plugin (warning: not tested): \ {{{ \ jQuery.fn.hasAllClasses = function( classes ) { \ ( classes.match( /\\S+/g ) || [] ).forEach( function ( clazz ) { \ if ( !this.hasClass( clazz ) ) { \ return false; \ } \ }); \ return true; \ }; \ }}} → 1369678646611546
_comment1: `hasClass` doesn't support multiple classes, its behavior on input with multiple classes is unspecified: \ {{{ \ $('<div>').addClass('a b').hasClass('a b') \ true \ $('<div>').addClass('a b').hasClass('b a') \ false \ }}} \ I'm against such a change, it's not obvious if `hasClass('class1 class2')` is supposed to mean that element has all of those classes set or at least one of them. If you really need it, you can define a very small plugin (warning: not tested): \ {{{ \ jQuery.fn.hasAllClasses = function( classesString ) { \ var i, \ classes = ( classesString || '' ).match( /\\S+/g ) || [] \ for ( i = 0; i < classes.length; i++ ) { \ if ( !this.hasClass( classes[ i ] ) ) { \ return false; \ } \ }; \ return true; \ }; \ }}} → 1369678719786867

hasClass doesn't support multiple classes, its behavior on input with multiple classes is unspecified:

$('<div>').addClass('a b').hasClass('a b')
true
$('<div>').addClass('a b').hasClass('b a')
false

I'm against such a change, it's not obvious if hasClass('class1 class2') is supposed to mean that element has all of those classes set or at least one of them. If you really need it, you can define a very small plugin (warning: not tested):

jQuery.fn.hasAllClasses = function( classesString ) {
    var i,
        classes = ( classesString || '' ).match( /\\S+/g ) || [];
    for ( i = 0; i < classes.length; i++ ) {
        if ( !this.hasClass( classes[ i ] ) ) {
            return false;
        }
    };
    return true;
};

Changed May 27, 2013 06:19PM UTC by dmethvin comment:4

resolution: → plugin
status: new → closed

This does seem like perfect plugin material to me. You can implement hasAllClasses, hasAnyClass, or whatever. You could also do it using $el.filter(".class1.class2").length > 0 or similar.

Changed September 07, 2013 03:25PM UTC by maxwellaguiarsilva@gmail.com comment:5

I agree that .hasClass("a b").hasClass("b a") must be true.