I'm trying to figure out how to do a switch statement where I need to find a class name of the object, then do something depending on the class name (in the switch statement).

In this example, I need the switch statement to do whatever I need when the class contains a specific word, such as "person".

html

<div class="person temp something"></div>

javascript

$(document).on('mousedown', function(e) {
    var clicked = $(e.target).attr('class');
    console.log(clicked);
    switch (clicked) {
        case "person":
            //do something
            break;
        default:    
            //do something  
    }
});

It's not guaranteed that the switch statement name, such as "person" will be in the first spot.

I know I can search through an array for a specific word, but I don't know how to add that to this sort of thing.

I'm trying to figure out how to do a switch statement where I need to find a class name of the object, then do something depending on the class name (in the switch statement).

In this example, I need the switch statement to do whatever I need when the class contains a specific word, such as "person".

html

<div class="person temp something"></div>

javascript

$(document).on('mousedown', function(e) {
    var clicked = $(e.target).attr('class');
    console.log(clicked);
    switch (clicked) {
        case "person":
            //do something
            break;
        default:    
            //do something  
    }
});

It's not guaranteed that the switch statement name, such as "person" will be in the first spot.

I know I can search through an array for a specific word, but I don't know how to add that to this sort of thing.

• javascript
• jquery

• 3 It sounds like a switch statement is not the appropriate approach for this problem. It uses strict parison to pare the input value to each case value. Use an if statement instead. – Felix Kling Commented Aug 16, 2014 at 3:03

3 Answers 3

As I said in my ment, a switch statement doesn't appear the appropriate approach in this situation.

Since you are using jQuery, just use .hasClass:

if ($(e.target).hasClass('person')) {
  // do something
}

If you want to do something more plicated for multiple classes, you can create a class -> function mapping and simply iterate over the class list:

var classActions = {
    person: function(element) { /* do something */ },
    temp: function(element) { /* do something */},
    // ...
};

var classes = e.target.className.split(/\s+/);
$.each(classes, function(index, cls) {
    classActions[cls](e.target);
});

You'll want to use a bination of .split() and .indexOf(). Your code would be something like this:

var clicked = $(e.target).attr('class');
var classes = clicked.split(' ');

    if(classess.indexOf('person') > 0) {
      //do work
    } else if (classes.indexOf('foo') > 0) {
      //do work
    } else if (classes.indexOf('bar') > 0) {
      //do work
    }

MDN documentation on .split()

MDN documentation on .indexOf()

Note that there are plenty of methods that allow you to do this. For example you can use string.search(substring) to check if a string contains your substring. If there is a substring it returns the index it was found (some number from 0 to n), otherwise if it's not found it returns -1. So if the search is larger or equal to 0, the substring exist.

if(clicked.search("person") >= 0)
    // "person" is in clicked