Найдите ближайший div в добавленном элементе [jQuery] - PullRequest
Новая
       14

Найдите ближайший div в добавленном элементе [jQuery]

0 голосов
/ 23 января 2019

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

HTML 

<body>

<div class="container">
  <br><append></append><br>
  <button class="btn btn-primary" style="margin-top: 15">add</button>
</div>

</body>

JQuery 

$('button').on('click', function(){
    $('append').append('<a href="#">click me</a><div class="show-data"></div><br>');
});

$('body').on('click', 'a', function(){
    $(this).closest('.show-data').html('hello');
})

Вы можете попробовать это здесь https://jsfiddle.net/vkuzdgsL/

Итак, моя цель - показать слово hello внутри <div class="show-data"></div>, но использование функции $(this).closest('.show-data'), похоже, не работает. Если я заменю .show-data на div, он обнаружит родительский div вместо этого.

1 Ответ

0 голосов
/ 23 января 2019

.closest () работает с деревом как поиск родителей, поэтому он не работает в вашем случае, так как элемент находится рядом с ним, а не в дереве предков.

Для каждого элемента в наборе получите первый элемент, который соответствует селектору, проверив сам элемент и пройдя через его предков в дереве DOM.

Используйте .next () , поскольку имя предполагает поиск следующего элемента.

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

$('body').on('click', 'a', function() {
  $(this).next('.show-data').html('hello');
});

Рабочая демоверсия

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...