多個變量

Question

我有這樣

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

我想服用點像這樣使用變量代碼：

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

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

我看到var1和var2被設置爲正確的價值觀，但每次我嘗試使用2個變量作爲選擇器失敗。當我保持點擊觸發器不變並在代碼的其他地方分別使用var1或var2（只是var1或var2，但不在相同的選擇器列表中）時，它可以工作。有小費嗎？

我想我使用var3連接var1和var2，但我想減少另一個變量。

Answer 1

你錯過的空間，沒有它，就成了.class1.class2這意味着元素必須有兩個班，沒有得到的第一個等

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

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

後裔另一種辦法是find()

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

只是在做$(var1 var2)將與var fail = var1 var2;相同這是一個語法錯誤。

Answer 2

你的示例代碼有一個JavaScript語法錯誤（如果你打算連接它們，應該在var1和var2之間加上一個加號）。然而，這會產生一個選擇器「.class1.class2」，這不是你正在尋找的東西 - 這會找到一個元素，其類型爲，而不是具有class1或class2的元素。

因此，首先，您需要一個加號來修復您的語法錯誤。但是你需要在你的類名之間加上逗號來選擇正確的元素。

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

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

Answer 3

另一種選擇是使用jQuery對象作爲變量。這將避免必須聲明第三個變量，這是非常微不足道的，但如果你真的想這樣做，有一種方法。

這是假設你試圖將該函數應用於任何具有任何類的元素，這不是你現有的代碼示例顯示的（$(".class1 .class2").on），但對我來說，這似乎是你實際要求的。

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

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

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