Javascript Toggle Colapse Div funktioniert nicht

Es funktionierte und jetzt tut es nicht. Ich kann einfach nicht finden, was ich falsch gemacht habe. Es sollte ein div mit Führerscheinkategorien angezeigt werden, wenn Sie im Auswahlfeld "Ja" auswählen.Javascript Toggle Colapse Div funktioniert nicht

Folgendes ist der Quellcode. Es sollte sehr einfach sein, diese zu lösen, ich kann einfach nicht sehen, es :(

var nein = $('#nein'), 
 
    ja = $('#ja'); 
 

 
ja.click(function() { 
 
    if ($('#kfz').hasClass('in')) { 
 
    return false; 
 
    } 
 
}); 
 

 
nein.click(function() { 
 
    if (!$('#kfz').hasClass('in')) { 
 
    return false; 
 
    } 
 
});

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script> 
 
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
</head> 
 
<body> 
 
    <label for="has_driverslicense">KFZ F&uuml;hrerschein:</label> 
 
    <select class="form-control" required="required" id="has_driverslicense" name="has_driverslicense"> 
 
    <option value="0" id="nein" data-toggle="collapse" data-target="#kfz">Nein</option> 
 
    <option value="1" id="ja" data-toggle="collapse" data-target="#kfz">Ja</option> 
 
    </select> 
 

 
    <div id="kfz" class="collapse out"> 
 
    <div> 
 
     <input id="checkbox-20" class="checkbox-style" name="work_as_service" type="checkbox"> 
 
     <label for="checkbox-20" class="checkbox-style-3-label">B (Auto bis 3,49t)</label> 
 
    </div> 
 
    <div> 
 
     <input id="checkbox-21" class="checkbox-style" name="work_as_service_cashier" type="checkbox"> 
 
     <label for="checkbox-21" class="checkbox-style-3-label">BE (Auto mit Anh&auml;nger)</label> 
 
    </div> 
 
    <div> 
 
     <input id="checkbox-22" class="checkbox-style" name="work_as_service_leader" type="checkbox"> 
 
     <label for="checkbox-22" class="checkbox-style-3-label">C1 (LKW bis 7,49t)</label> 
 
    </div> 
 
    <div> 
 
     <input id="checkbox-23" class="checkbox-style" name="work_as_bar" type="checkbox"> 
 
     <label for="checkbox-23" class="checkbox-style-3-label">C (LKW bis 40t)</label> 
 
    </div> 
 
    <div> 
 
     <input id="checkbox-24" class="checkbox-style" name="work_as_logistics" type="checkbox"> 
 
     <label for="checkbox-24" class="checkbox-style-3-label">CE (LKW mit Anh&auml;nger)</label> 
 
    </div> 
 
    <div> 
 
     <input id="checkbox-25" class="checkbox-style" name="work_as_cook" type="checkbox"> 
 
     <label for="checkbox-25" class="checkbox-style-3-label">Fahrerkarte</label> 
 
    </div> 
 
    <div> 
 
     <input id="checkbox-26" class="checkbox-style" name="work_as_cook_assistant" type="checkbox"> 
 
     <label for="checkbox-26" class="checkbox-style-3-label">Gabelstaplerf&uuml;hrerschein</label> 
 
    </div> 
 
    <div> 
 
     <input id="checkbox-27" class="checkbox-style" name="work_as_cook_assistant" type="checkbox"> 
 
     <label for="checkbox-27" class="checkbox-style-3-label">Gel&auml;ndestaplerf&uuml;hrerschein</label> 
 
    </div> 
 
    <div> 
 
     <input id="checkbox-28" class="checkbox-style" name="work_as_cook_assistant" type="checkbox"> 
 
     <label for="checkbox-28" class="checkbox-style-3-label">IPAF – Arbeitsbühnen</label> 
 
    </div> 
 
    </div> 
 
</body> 
 
</html>

Quelle

2016-07-20 lewis4u

ein Teil deines Codes fehlt Alles, was du machst, wenn #ja geklickt wird, ist ... ret Urne falsch; Also musst du deinen ganzen Code zeigen –

hast du auch jquery? Ich habe jquery hide() benutzt und es funktioniert. – whales

den Wert von ausgewählten Route, und verwenden Sie addClass/remoceClass

$("#has_driverslicense").on("change", function(){ 
    if($(this).val() === "1") { 
    $('#kfz').addClass("in"); 
    } else { 
    $('#kfz').removeClass("in"); 
    } 
})

I‘ Habe die Geige aktualisiert: https://jsfiddle.net/aq8pqbft/1/

Quelle

2016-07-20 14:32:22

Das war die beste Lösung! – lewis4u

Javascript Toggle Colapse Div funktioniert nicht

Antwort

Verwandte Themen