Получить всю информацию о родителях до указанного родителя

У меня есть пример HTML-кодов:

<html>
    <body>
        <div>
            <div id="stophere">
               <h4 class="parentclass"> 
                <span class="target">Clicked</span>
               </h4>
            </div>
        </div>
    </body>
</html>

Из приведенного выше примера HTML-кодов, я хочу получить имя тега всех родителей класса target (при получении события клика) вниз от div с идентификатором stophere,

Я попробовал этот код:

$(ev.target).parents()
            .map(function() {
            return this.tagName;
            })
            .get()
            .join( ", " );

Но это включает в себя имена всех родителей выше stophere, В то время как результат, который я хочу, это только 1 div и 1 h4,

Как правильно получить всех родителей target вниз от stophere?

2 ответа

Решение

Вы можете использовать parentsUntil метод для этого

$(ev.target).parentsUntil($('#stophere').parent())

Обратите внимание, что это не включено, поэтому мы передаем родительский #stophere включить этот элемент, а также

FIDDLE

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

Этот код проверяет, содержит ли предел обхода саму эту линию ограничения, используя find() метод:

    jQuery('html').on("click", function (ev) {
        var elemparentid = jQuery(ev.target).closest("[id]").attr("id");
        var thisparents = jQuery(ev.target).parents()
            .map(function () {
// check if traversing limit is a children of current element or not, by using find() method
            if (jQuery(this).find("#" + elemparentid).length < 1) {
                return this.tagName;
            }
        }).get()
            .join(", ");
        alert(thisparents);
    });

FIDDLE

Другие вопросы по тегам