2017-03-16 2 views
0

Ich suchte einen Code, um einen Klassennamen aus einem Baummenü zu entfernen, auf diese Weise, um diesen Baummenütyp zu stoppen, und das kann eine normale Div-Box verwenden. Mit anderen Worten, mein jQuery-Code fügt eine eigene Klasse hinzu und ich möchte sie aus einem bestimmten div und aus allen Kindern dieses div entfernen (Kinder, Enkel, Enkel usw.).Wie entfernt man einen Klassennamen mit jQuery für alle Kinder eines div-Elements?

(Ich nehme das HTML, CSS und jQuery-Codes aus einem Tutorial auf youtube: D)

Meinen HTML-Code es so ist:

<div class="meniuArbore"> 
<div><p>Bucharest</p> 
    <div>Place 1 
     <div class="prezentare"> // from this on (inclusive), to don't have the tree menu style 
      <div class="prezentareBox1"> 
      </div> 
      <div class="prezentareBox2"> 
      </div> 
     </div> 
    </div> 
</div> 

Mein CSS Stil wie diese :

.prezentare { 
    width: 153mm; 
    height: 40mm; 
    border: 0.5mm solid #000; 
} 

.meniuArbore { 
    padding-top: 10px; 

} 

.meniuArbore div { 
padding-left: 20px; 

} 

.meniuArbore .parinte div { 
display: none; 
cursor: default; 
} 

.meniuArbore .parinte { 
cursor:pointer; 
background:transparent url(http://www3.telus.net/jianlu58/plus.gif) no-repeat left 1.1mm; 
} 

.meniuArbore .extins { 
background:transparent url(http://www3.telus.net/jianlu58/minus.gif)no-repeat left 0.2mm; 
} 

Und der jQuery-Code:

/* Meniu tree */ 
$(function() { 
$('.meniuArbore div:has(div)').addClass('parinte'); 

// I added here the code from bellow, that I came up with ... 
$('.meniuArbore div').click(function() { 
var thistree = $(this); 
thistree.children('div').toggle(); 
thistree.filter('.parinte').toggleClass('extins'); 
return false; 
}); 
}); 

Und der Code, den ich denke, es sollte dies die Klasse „parinte“ brüllen die Klasse „Prezentare“ ist entfernen:

$('div:hasClass(prezentare)').removeClass('parent'); 
$('div:hasClass(prezentare)').find('*').removeClass('parent'); 

Einige raten bitte! Ich bin neu bei jQuery, aber ich fühle, dass ich sehr nahe bin. : D

Antwort

1

Alles, was Sie tun müssen, ist die übergeordnete Namen in der Auswahl vor dem Klassennamen Sie von den Kindern entfernt werden soll verwenden:

sagen wir, Sie mit Kindern ein Elternteil mit einem ID-Behälter haben, der den Klassennamen haben von "classYouWantToRemove". Du würdest es so machen.

$ ("# Container .classYouWantToRemove"). RemoveClass ("classYouWantToRemove")

einen Blick auf die Arbeits Schnipsel Nehmen Sie die HTML-und Inline-JQuery Arbeit zu sehen.

#container .classYouWantToRemove { 
 
border: solid 1px red; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="container"> 
 
<div class="classYouWantToRemove">Hey</div> 
 
<div class="classYouWantToRemove">Hey</div> 
 
<div class="classYouWantToRemove">Hey</div> 
 
<div class="classYouWantToRemove">Hey</div> 
 
<div class="classYouWantToRemove">Hey</div> 
 
<div class="classYouWantToRemove">Hey</div> 
 
<div class="classYouWantToRemove">Hey</div><div class="classYouWantToRemove">Hey</div> 
 
<div class="classYouWantToRemove">Hey</div> 
 
<div class="classYouWantToRemove">Hey</div> 
 
</div> 
 
<button id="removeAll" onclick='$("#container .classYouWantToRemove").removeClass("classYouWantToRemove")'>Remove classes</button>

+0

Dank! :) Sie haben mein Problem nicht gelöst, aber Sie gaben mir eine einfache Idee ... :) Ich habe direkt den Namen der Klasse, die ich wollte in den Selektor-Tag, stattdessen 'div: hasClass (Präsentation)' Code, wie dies: '$ ('. meniuArbore .presentation'). removeClass ('parent'); $ ('. MeniuArbore .presentation div: hat (div)'). RemoveClass ('parent'); ' Und jetzt funktioniert es, so wie ich es wollte! :) –

Verwandte Themen