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.
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
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