используя .each с closest () - PullRequest
       11

используя .each с closest ()

1 голос
/ 05 марта 2012

Я пытаюсь перебрать кучу полей в форме и мне нужно изменить текст ссылки.

Мой желаемый результат:

Alert("Second 1");
Alert("Second 2");

Пример кода:

<div class="text-wrapper">
    <input class="field-text" value="">
</div>
<div>
    <ul>
        <li><a href="" class="first">First</li>
        <li><a href="" class="second">Second 1</li>
    </ul>
</div>
<div class="text-wrapper">
    <input class="field-text" value="">
</div>
<div>
    <ul>
        <li><a href="" class="first">First</li>
        <li><a href="" class="second">Second 2</li>
    </ul>
</div>

<script>
jQuery(document).ready(function() {
        jQuery(".text-wrapper").each(function(){
            var value = jQuery(this).closest("a.second").text();
            alert(value);
        });
});
</script>

Ответы [ 4 ]

4 голосов
/ 05 марта 2012

closest находит родительский элемент, соответствующий селектору, а не дочерний.

Вы хотите find вместо.

РЕДАКТИРОВАТЬ: find не будет работать, поскольку тег, который вы ищете, не является потомком text-wrapper. Вам нужно вручную пройти DOM, чтобы найти элемент.

jQuery(this).next('div').find("a.second").text();
2 голосов
/ 05 марта 2012

closest() идет вверх по дереву DOM, начиная с самого узла, затем его parentNode, parentNode parentNode и т. Д. Функция, которую вы ищете: find(), которая ищет потомков данного узла.

Изменить для полноты:

Так как a.second не является потомком .text-wrapper, вам сначала нужно вызвать next(), который возвращает следующего брата .text-wrapper, то есть элемент div, содержащий a.second.

jQuery(this).next().find('a.second').text()
0 голосов
/ 05 марта 2012

Это должно работать в соответствии с предоставленным вами тестовым примером. Вы не правильно закрыли тег, который нужно закрыть, прежде чем пытаться использовать следующий код:

$("div:odd").each(function(){
    var value = $(this).find("a.second").html();
    alert(value);
});

Скриптовая ссылка: http://jsfiddle.net/harshithjv/2ePn9/1/

0 голосов
/ 05 марта 2012

Полный jsFiddle рабочего решения, включая обе ссылки, отображаемые в журнале консоли: http://jsfiddle.net/3rH63/

...