Jquery находит родителя дочернего элемента, затем применяет действие к другому дочернему элементу исходного родителя.

0

Я пытаюсь реализовать окно поиска, которое выделяет результаты в нескольких div, которые изменяются по размеру и перетаскиваются.

Я дошел до точки, где я могу искать и выделять результаты, но действие выполняется во всех div, а не в том, что в настоящее время активно. Идеальное решение применило бы действие к используемому элементу, а не ко всем доступным элементам.

Когда кто-то вводит в поле ввода с class="sch", я пытаюсь найти родительский div с class="resdiv1000". Затем мне нужно пройти по элементам, чтобы найти iframe с name="resdiv1000".

Я пытаюсь использовать следующий код в jquery ниже. Это не работает. Полный пример jquery работает, но когда этот фрагмент включен, он прерывается. Почему это происходит? Любые предложения приветствуются.

var test = $(this).closest('div[class^="resdiv"]').children('iframe[name^="resdiv"]');
var page2 = test.contents().find('html');

Вот HTML:

<div class="resdiv1000 resizable">
    <div class="checkdrag">
        <div class="backward" onclick="resdiv1000.history.back()">&lt;</div> 
        <div class="forward" onclick="resdiv1000.history.forward()">&gt;</div>
        <span class="rslts-a"></span>
        <input type="text" class="sch" />
    </div>
    <div class="xout">X</div>
    <div id="rescont1000" >
        <iframe src="http://www.Thissite.com/grab.php?item=http://www.mysite.com" name="resdiv1000"></iframe>
    </div>
    <div class="ui-resizable-handle ui-resizable-e" style="z-index: 90;"></div>
    <div class="ui-resizable-handle ui-resizable-s" style="z-index: 90;"></div>
    <div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 90;"></div>
</div>

Здесь jquery, который я использую:

$(function() {
    $('.sch').bind('keyup change', function(ev) {
        // pull in the new value
        var searchTerm = $(this).val();

        // remove any old highlighted terms
         var page2 = $('iframe[name^="resdiv"]').contents().find('html');
         page2.removeHighlight();
        //$('body').removeHighlight();

        // disable highlighting if empty
        if ( searchTerm ) {
            // highlight the new term
            page2.highlight( searchTerm );
            //$('body').highlight( searchTerm );
        }

    });
});
Теги:

2 ответа

1
Лучший ответ

В своем фрагменте кода попробуйте изменить это:

var test = $(this).closest('div[class^="resdiv"]').children('iframe[name^="resdiv"]');

в это:

var test = $(this).closest('div[class^="resdiv"]').find('iframe[name^="resdiv"]');

поскольку аргумент, который вы передаете children(), только фильтрует прямые дочерние элементы элемента, а не потомки.

  • 0
    Это добилось цели, спасибо за помощь ...
2
var test = $(this).closest('.resdiv').find('iframe');
var page2 = test.contents().find('html');

При назначении тестовой переменной метод children ищет только прямых потомков. IFrame вложен в другой элемент. Найти ваше решение.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню