javascript - Multiple variables in jquery selector - Stack Overflow

admin管理员组

文章数量:1345083

I have a code like this

$(".class1 .class2").on('click', function(){
 //Do something        
});

I am trying to somehting like this using variables:

var1=".class1";
var2=".class2"

$(var1 var2).on('click', function(){
   //Do something        
});

I see var1 and var2 are set to right values, but everytime I try to use 2 variables as selector it fails. When I keep the click trigger unchanged and use var1 or var2 elsewhere in the code individually (just var1 or var2 but not in the same selector list) it works. Any tips?

I figure I use var3 concatenate var1 and var2, but I am trying to reduce another variable.

I have a code like this

$(".class1 .class2").on('click', function(){
 //Do something        
});

I am trying to somehting like this using variables:

var1=".class1";
var2=".class2"

$(var1 var2).on('click', function(){
   //Do something        
});

I see var1 and var2 are set to right values, but everytime I try to use 2 variables as selector it fails. When I keep the click trigger unchanged and use var1 or var2 elsewhere in the code individually (just var1 or var2 but not in the same selector list) it works. Any tips?

I figure I use var3 concatenate var1 and var2, but I am trying to reduce another variable.

• javascript
• jquery

Share Improve this question Follow edited Oct 18, 2016 at 18:35 Theraot 40.5k66 gold badges6666 silver badges100100 bronze badges asked Oct 18, 2016 at 18:30 user3861559user3861559 99388 gold badges2626 silver badges4646 bronze badges 1

• Variables are cheap. var1 var2 is not a list, it is a syntax error.... and even if it were a list, that list would be an object. Perhaps what you don't want is to pollute the name space, in that case, just do the concatenation inline as adeneo suggests. – Theraot Commented Oct 18, 2016 at 18:38

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

Another option would be to use jQuery objects as your variables. This would avoid having to declare a third variable, which is pretty trivial to do, but if you really want to, there is a way.

This is assuming you are trying to apply the function to any element that has either class, which is not what your existing code example shows ($(".class1 .class2").on) , but to me it seems like this is what you are actually asking for.

var var1 = $('.clickable');
var var2 = $('.anotherClass');

var1.add(var2).on('click', function() {
  console.log('button clicked!');
});

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="clickable">Click 1</button>
<button class="anotherClass">Click 2</button>

You're missing the space. Without it, it bees .class1.class2 which means the element has to have both classes, not get the descendant of the first one, etc.

var1 = ".class1";
var2 = ".class2";

$(var1 + ' ' + var2).on('click', function(){
   //Do something        
});

Another option would be find()

$(var1).find(var2).on(...

Just doing $(var1 var2) would be the same as var fail = var1 var2; it's a syntax error.

Your sample code has a JavaScript syntax error (there should be a plus sign between var1 and var2, if you intend to concatenate them). However, this would produce a selector ".class1.class2" which is not what you're looking for - this would find an element that has both classes, rather than elements that have either class1 or class2.

So, firstly, you need a plus sign to fix your syntax error. But then you'll need a ma between your class names to select the correct elements.

var1=".class1";
var2=".class2"

// Select ".class1,.class2" (either class1 or class2)
$(var1 + ',' + var2).on('click', function(){
   //Do something        
});

本文标签： javascriptMultiple variables in jquery selectorStack Overflow