Возможно ли повторное вызов успешного селектора jQuery?

Question

Предположим, что у меня есть набор селекторов, которые передаются, а затем, если один из них успешно, я хочу снова проверить этот селектор, но под элементом верхнего уровня, а затем запустить событие, если оно будет найдено. Так что ...

$('element1, element2, element3').click(function() { 
    $('#header' + successfulElement).addClass('active'); 
    }); 

Затем, если пользователь нажимает любой из тех elements (там может быть несколько по всему документу) мы проверяем, если элемент с таким же селектором находится под #header.

Это имеет смысл? Это звучит сложно, но я не удивлюсь, если я упустил что-то принципиальное.

Заранее спасибо.

Answer 1

Существует не общий способ узнать, какая часть селектора соответствует данному элементу, но если ваши селекторы имеют конкретную форму, вы можете использовать определенные свойства. Например, если каждый elementN является HTML тегов, вы можете использовать this.tagName для восстановления совпадающего тега:

$('element1, element2, element3').click(function() { 
    $('#header ' + this.tagName).addClass('active'); 
}); 

Кроме того, вы можете использовать this.className, чтобы получить имя класса (ов) щелкнутого элемента.

---

Update: Поскольку ваши селекторы являются довольно сложными, единственным выходом может быть, чтобы связать отдельные обработчики для каждого суб-селектор. Вы можете автоматически генерировать эти обработчик, как это:

function bindClick(selector) { 
    $(selector).click(function() { 
    $('#header ' + selector).addClass('active'); 
    }); 
} 

var selectors = [ 'a[href*="/el1"]', 'a[href*="/el2"]', 'a[href*="/el3"]' ]; 
for (var i = 0; i < selectors.length; i++) 
    bindClick(selectors[i]); 

Answer 2

Использование closest():

$('element1, element2, element3').click(function() { 
    var $this = $(this); 

    if ($this.closest("#header").length) 
     $this.addClass('active'); 
}); 

Вы также можете использовать parents(), но closest() делает ту же работу, за исключением того, что останавливается, когда он достигает соответствия элемента (так он лучше).

Answer 3

Может вам подножку вопрос полностью, давая элементы в вопросе какое-то общность (например, с использованием общего DATA- атрибутом), то делает ниже?

$("selector1, selector2, selector3").bind("click", activate); 

function activate(e){ 
    $(".active").removeClass("active"); 
    $("[data-id='" + $(this).attr("data-id") + "']", 
     $("header")).addClass("active").trigger("some event"); 
}