Jquery parent () не работает после вызовов ajax
Поскольку класс добавляется динамически, мы используем обработчик событий для содержимого, загруженного с помощью ajax, например:
$('.menu').click(function(){
.....
})
К
$(document).on('click','.menu',function(){
.....
})
То же самое и здесь, следующая функция работает на той же странице, но при использовании после загрузки ajax она не работает. Как я могу использовать для этого обработчик событий?
$('.submenu').parent().each(function(){
if ($(this).children("ul").length) {
$(this).find('.submenu').html('+');
}
})
@LouysPatriceBessette, у меня вопрос, как привязать $('.submenu').parent().each(function(){, а не другой ($(document).on('click', 'input[name = "nav[]"]', function() {}) .. это просто ссылка, он работает.
ОК. Затем покажите разметку HTML. Как я могу узнать, что является родительским для .submenu и что там динамически создается?
$ ('. submenu'). parent () должен соответствовать только одному элементу. Поэтому использование итератора each() на том, что он возвращает, не требуется. Помимо этого, что выводит console.info(this) внутри вашего закрытия? При отладке вы должны использовать дедуктивные рассуждения. Узнайте, что на самом деле возвращают ваши селекторы. Затем вы сможете узнать, какие методы и свойства доступны. console.info
Вы можете захотеть $('.submenu').each(function(){ $(this).parent() ... });
Ответы 2
У вас проблема с $('.submenu').parent().each(function( ... ));. Этот фрагмент кода будет делать только одну итерацию, потому что метод parent(), вызываемый в селекторе, будет проходить и выбирать только один родительский элемент.
Если вы хотите выбрать каждый .submenu для перебора, правильным способом сделать это будет $('.submenu').each(function(){ ... }));, а затем внутри вашего закрытия введите нужный код.
Поскольку вы не предоставили никакого HTML для размышлений, я могу только предположить, что ваша структура похожа на:
<html>
<body>
<div class='menu'>
<div class = "submenu'>
<ul>
<li></li>
</ul>
</div>
<div class = "submenu">
<ul>
<li></li>
</ul>
</div>
<div class = "submenu">
<!--
no unordered list here to match
this submenu is ignored
-->
</div>
</div>
</body>
</html>
Или же
<html>
<body>
<div class='menu'>
<div class = "submenu'>
<ul>
<li></li>
</ul>
</div>
<div class = "submenu">
<ul>
<li></li>
</ul>
</div>
</div>
<div class='menu'>
<div class = "submenu'>
<ul>
<li></li>
</ul>
</div>
</div>
</body>
</html>
(Если это последнее, то, возможно, вызов метода parents() с вашим существующим кодом даст желаемый результат)
Если это первое, то вы, вероятно, захотите сопоставить каждый .submenu, а затем проверьте, есть ли неупорядоченный список в качестве дочернего. Если есть, то добавить к нему "+"?
Кроме того, метод html() в jQuery похож на свойство innerHTML для ванильного javascript. Таким образом, html('+') заменит содержимое на "+".
Если это то, что вы намереваетесь, тогда ваш javascript будет выглядеть так:
$('.submenu').each(function(){
if ( $(this).has('ul') ) {
$(this).html('+');
}
});
Это странно, но я не знаю, каков ваш конечный результат. Кажется, что имеет смысл добавить кнопку '+', если есть неупорядоченный список, и вы хотите добавить элемент списка:
$('.submenu').each(function(){
if ( $(this).has('ul') ) {
$(this).find('ul').append('+');
}
});
Вы хотите, чтобы у вас было что-то подобное ...
$(document).on('click', [ ---$('.submenu').parent()---] ,function(){
// ...
});
* Не могли бы вы просто провести урок для этих родителей?
$(document).on('click', ".submenu" ,function(){
$(this).parent()...
});
Второй селектор, переданный в .on(), будет найден в момент выполнения обратного вызова. Затем вы можете найти родительский элемент $(this).
Трудно сказать с таким небольшим количеством кода ... Но попробуйте
$(document).on('click', 'input[name^ = "nav"]', function() {}, где^=означает «начинается с».