jQuery選擇與其他元素的類名匹配的元素

我有幾個元素，其中一個元素可能有多個類名 - 其中一個是常見的。jQuery選擇與其他元素的類名匹配的元素

如：

<div class='div1 someClassname someOtherClassname'></div> 
<div id='container'> 
    <div class='div1'> 
    </div> 
</div>

所以，我有上.someClassname火災，但我需要做一些與#container .div1的事件。我如何選擇#container .div1，僅使用我可以從.someClassname中收集到的事件時發生事件？

下面是我用實驗的那種東西：

$('.someClassname').click(function(){ 
    var classes = $(this).attr('class'); // 'div1 someClassname someOtherClassname' 
    var otherElem = $('#container').children().filter(classes); //empty jQuery object 
});

我真的不能解析的類名，因爲我不知道我在尋找特定的類或類，我'm 不是尋找數字和名稱更改取決於。

任何指針十分讚賞

來源

2012-01-10 jammypeach

我說你在正確的軌道上。問題'過濾器'給出一個空的結果是你的類字符串由類名組成，但過濾器希望類選擇符（帶點）。 – Yoshi 2012-01-10 10:45:41

試試這個

$('.someClassname').click(function(){ 
    var classes = $(this).attr('class').split(" ").join(",."); 
    alert(classes); 
    $('.'+classes).not(this).each(function(){ 
    alert($(this).text()); 
    }); 

});

小提琴：http://jsfiddle.net/3rVjN/

來源

2012-01-10 10:45:39

多數民衆贊成在相當優雅 - 這對我有效 – jammypeach 2012-01-10 10:51:13

如果我理解正確，你將需要使用的類split，並與點和逗號作爲必要格式化您的選擇。給它一個去，如果你還在努力，我會發布一些測試代碼。

來源

2012-01-10 10:42:22

我覺得你差不多了。只需要.splitclasses var與，爲每個數組元素添加.，然後將數組加回到,，以便您獲得.div1, .otherclassname, etc.。你可以使用這個字符串作爲你的選擇器。

這假設你想要關於類的邏輯OR。否則（如果你想和），不要加入,，只需將元素粘在一起。

來源

2012-01-10 10:44:22 bububaba

您不應該濫用此功能class。

添加一個額外的屬性，例如HTML5的data-target="div1"到.someClassName元素。

<div data-target="div1" class="div1 someClassname someOtherClassname"></div> 
<div id="container"> 
    <div class="div1"> 
    </div> 
</div>

，然後在代碼：

$('.someClassname').click(function() { 
    var target = $(this).data('target'); 
    var other = $('#container').children('.' + target); 
});

如果有與div1相關聯，那麼我就不會使用樣式都表明沒有實際的CSS樣式，並把一個id標籤上的目標DIV - 它會更快地按ID進行匹配，而不是按類進行匹配。

來源

2012-01-10 10:45:11 Alnitak

我同意你 - 我使用jquery的'data（）'方法來正常記錄這種東西。然而我發現自己需要這樣做，但仍然 – jammypeach 2012-01-10 10:48:47

@jammypeach你不知道什麼時候你創建的確切哪個「其他」類是「共同的」類嗎？ – Alnitak 2012-01-10 10:52:48

是的，但是其中有36個，並且它們被編號 - 所以我正在尋找一種更好的方式來以編程方式確定要使用哪一個。他們也有風格相關 - 但我認爲你可能是正確的，從最佳實踐的角度來看，數據屬性會更好。 – jammypeach 2012-01-10 10:56:50

這是你要找的代碼：

$('.someClassname').click(function(){ 
    var classes = $(this).attr('class'); // 'div1 someClassname someOtherClassname' 

    var arr = classes.split(" "); 
    var filter = [];    

    $.each(arr, function(index, item){ 
     filter.push("."+item) 
    })      

    var filterStr = filter.join(",") 

    var otherElem = $('#container').children().filter(filterStr); 
});

這個錯誤你有被認爲是類類名的字符串。 jQuery的.filter（）方法接受一個選擇器。

來源

2012-01-10 10:46:28

你可以做這樣的事情：

$('.someClassname').click(function(){ 
    var classes = $(this).attr('class').split(/\s+/); 
    $.each(classes , function(index, value) { 
     console.log($('#container').find("."+value)); 
}); 

});

sample

來源

2012-01-10 10:46:55 Kimtho6

我也有類似的問題，前幾天。這爲我工作：

// all your element classes 
allClasses = $('yourElement').attr("class").split(/\s+/); 

// retrieve desired classes 
for (var j = 0; j < allClasses.length; j++) { 
    if (allClasses[j] === 'class1' || allClasses[j] === 'class2' || allClasses[j] === 'class3') { 
    classes = classes+" "+allClasses[j] 
    } 
    }   
console.log(classes)

我用這個，如果我想拉class1,2,3出來的元素，它可以包含任意數量的與未知名類。

也許有幫助。

來源

2012-01-10 10:48:24 frequent

如果我正確理解你的問題，這應該幫助：

var classes = $(this).attr("class").split(/\s+/); 
var obj = $(); 
for (var i = 0; i < classes.length; i++) { 
    obj = obj.add($("#container ." + classes[i])); 
}

現在OBJ應該包含你的對象

來源

2012-01-10 10:57:24 piotrb

jQuery選擇與其他元素的類名匹配的元素

回答

相關問題