Reputation: 67
I have a number of basic accordion style elements that revel their content on click. However, some of these accordions contain a specific child element () that when present I want the accordion effect to be disabled on this entire accordion element. So if the page has 10 accordion elements and 5 of these contain the child element then these latter accordions should be static - i.e. no slideToggle.
I've been trying stuff like wrapping my code in a conditional such that if the parent does not have a child with a class="normal" then it executes the accordion code else it unbinds the click function from the parent.
function team () {
if (!$('.accordion').children().hasclass('.normal')) {
$('.accordion').click(function (e) {
var $textContent = $(this).find('.content');
$('.content').not($textContent).slideUp('slow');
$textContent.slideToggle('slow');
});
} else {
$(this).unbind('click');
}
}
I have a functioning fiddle of the basic accordion. However, I must be missing something because when I try the above code it doesn't function. Specifically I'm being told that if (!$('.accordion').children().hasclass('.normal'))
is not a function
Upvotes: 0
Views: 120
Reputation: 15393
Try
$('.content').hide();
$('.accordion').off('click').on('click', function (e) {
if(!$(this).find('.normal').length) { // check the condition here
var $textContent = $(this).find('.content');
$('.content').not($textContent).slideUp('fast');
$textContent.slideToggle('slow');
}
});
Upvotes: 0