Deze eigenschap of removeClass word niet ondersteund
Via de broncode heb ik gegekeken of jquery het juiste doet, alleen geeft hij het volgende aan:
"De eigenschap of methode removeClass wordt niet ondersteund door dit object"
het stukje code is:
Code (php)
1
2
3
4
2
3
4
$('ul').click(function(){
if(mouse == true){
$('ul').children('li').hasClass('open').removeClass('open')};
});
if(mouse == true){
$('ul').children('li').hasClass('open').removeClass('open')};
});
wie weet er een oplossing?
Kijk eens op api.jquery.com wat de return value van hasClass is...
Weg met die hasClass() inderdaad. De gebruik je alleen als je wilt weten of een element een bepaalde class heeft.
Wat raden jullie mij aan te doen i.p.v. hasClass()?
Ik wil jquery laten kijken of een bepaald element een bepaalde class heeft en vervolgens deze laten verwijderen.
Kijk eens naar "is()".
Code (php)
1
2
3
4
5
2
3
4
5
$('ul').click(function() {
if(mouse == true) { // geen idee wat dit is?
$("li").removeClass('open'); // alle listitems zijn nu zonder de class 'open'
}
});
if(mouse == true) { // geen idee wat dit is?
$("li").removeClass('open'); // alle listitems zijn nu zonder de class 'open'
}
});
Gewijzigd op 29/11/2014 13:36:35 door Frank Nietbelangrijk
Wat ik graag wil zal ik uitleggen:
Je hebt een element waarin zich 5 elementen in bevinden.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<div class="main">
<li>klik hier voor element 1
<div class="element1 hide"></div>
</li>
<li>klik hier voor element 2
<div class="element2 hide"></div>
</li>
<li>klik hier voor element 3
<div class="element3 hide"></div>
</li>
<li>klik hier voor element 4
<div class="element4 hide"></div>
</li>
<li>klik hier voor element 5
<div class="element5 hide"></div>
</li>
</div>
<li>klik hier voor element 1
<div class="element1 hide"></div>
</li>
<li>klik hier voor element 2
<div class="element2 hide"></div>
</li>
<li>klik hier voor element 3
<div class="element3 hide"></div>
</li>
<li>klik hier voor element 4
<div class="element4 hide"></div>
</li>
<li>klik hier voor element 5
<div class="element5 hide"></div>
</li>
</div>
Alle div elementen krijgen de class hide {display:none;} mee.
Als ik op klik hier voor element 1 klik moet de hide class van element 1 verwijderd worden.
Klik ik nu nog eens op klik hier voor element 1 dan moet hij weer de class hide meekrijgen.
Dit is nog te maken met bijvoorbeeld toggleClass('hide').
Nu kom ik op het punt waar ik op vast loop:
Ik klik op"klik hier voor element 1" dan haalt hij de class hide eraf, als ik dan vervolgens op een ander element klik 2,3,4, of vijf dan moet hij ook de class hide weer krijgen. Kort gezegd er mag steeds maar een element zichtbaar zijn.
Ik denk dat je zoiets wilt:
http://codepen.io/anon/pen/GgpgZx
Zoals ik deze week al eerder heb aangegeven in een ander topic:
-toggle is niet geschikt als je controlle wilt hebben over zichtbaar of onzichtbaar maken.
En omdat je in deze situatie alle div's onzichtbaar wilt maken behalve één moet je zeker weten dat je ze onzichtbaar maakt.
Ik doe het zelf altijd gewoon met jQuery's show() en hide() in plaats van met addClass() en removeClass().
http://codepen.io/anon/pen/wBKBzQ
Gewijzigd op 29/11/2014 17:32:14 door Frank Nietbelangrijk
Dit is inderdaad wat ik bedoel. Maar wat kan ik dan toevoegen, als ik 2 keer op de zelfde klik hij ook een hidden krijgt ?
Je gebruikt bijvoorbeeld:
Buiten dat li en div geen default gedrag hebben, ga je een eventListener hangen aan alle divs en li's in het gehele DOM.
Op verzoek:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$( document ).ready(function() {
$('li').click(function() {
// even zien wat de display status is
var oldStatus = $(this).children('div').css('display');
// alle div's met class element verbergen
$('.element').hide();
// de div die child-div is van 'this' laten zien
// maar alleen als de vorige status display:none; was
if(oldStatus == 'none')
$(this).children('div').show();
});
});
$('li').click(function() {
// even zien wat de display status is
var oldStatus = $(this).children('div').css('display');
// alle div's met class element verbergen
$('.element').hide();
// de div die child-div is van 'this' laten zien
// maar alleen als de vorige status display:none; was
if(oldStatus == 'none')
$(this).children('div').show();
});
});
Ook kan je binnen .children weer op dezelfde manier een selector gebruiken, het geeft meer controle over het hoe en wat.
Het kan natuurlijk zijn dat je het normaal gesproken anders doet, maar omdat meerdere personen dit lezen kunnen ze soort dingen als gebruikelijk ervaren.
Ja klopt dat is wat Yoeri aangeeft. Terechte opmerking
Gr. Yoeri