Wie findet man die ID des nächsten oberen Elements mit spezifischem Klassennamen?

Question

HTML-Code:

<div id="1" class="master"></div> 
<div id="2" class="slave"></div> 
<div id="3" class="slave"></div> 

<div id="4" class="master"></div> 
<div id="5" class="slave"></div> 
<div id="6" class="slave"></div> 

lassen Sie uns sagen, wir verwenden $ ('div')() klicken diese DIV-Elemente anklickbar zu machen.

$('div').click(function() { 
    var el = $(this); 
    var master_id = ???; 
    alert(master_id); 
}); 

Dann auf DIV-Elemente mit Klasse Klick auf " slave "müssen wir die ID des nächsten oberen DIV Elements mit der Klasse" master "alarmieren, also wenn wir auf DIV # 5 oder DIV # 6 klicken, alerts =" 4 "(DIV # 4), wenn DIV # 2 oder DIV # 3 - Warnungen = "1" (DIV # 1). Aber wie geht das? ;)

Answer 1

Aktualisiert:

$('div').click(function() { 
    var el = $(this); 
    var master_id = el.prevAll('.master').attr('id'); 
    alert(master_id); 
}); 

Edit:
Sie können auch Filter verwenden, so dass, wenn Sie ein div mit calss 'Master' klicken, wird es das Ereignis nicht ausgelöst:

$('div').click(function(e) { 
    var el =$(this); 
    if (!el.is('.master')){ 
     var master_id = el.prevAll(".master").attr('id'); 
    alert(master_id); 
    } 

Answer 2

Ich dachte zuerst, prev würde tun, aber nach einigen Tests habe ich festgestellt, dass es nicht auf einem slave nicht direkt installiert funktioniert y nach einem anderen slave. Greifen das erste Spiel von prevAll funktionierte perfekt.

Demo: http://jsbin.com/ulipi

$('.slave').click(function() { 
    var el = $(this); 
    var master_id = $(el.prevAll('.master').get(0)).attr('id'); 
    alert(master_id); 
});