2016-11-27 8 views
1

Hier ist der Code für die dynamisch erstellten Kontrollkästchen. Wie füge ich dem Code Zeilenumbrüche hinzu, so dass ich pro Zeile ein Kontrollkästchen habe? Ich habe versucht, document.createElement("br") tun und es nach get.appendChild(label) anhängen, aber es hat nicht funktioniert.Wie wird nach jedem dynamisch erstellten Kontrollkästchen ein Zeilenumbruch eingefügt?

function setCheckboxes(browser) { 
    var get = document.getElementById("get"); 

    if (browser == "courses") { 
     for (var i = 1; i < coursesGetKeys.length; i++) { 
      var checkBox = document.createElement("input"); 
      var label = document.createElement("label"); 
      checkBox.type = "checkbox"; 
      checkBox.value = coursesGetKeys[i]; 
      checkBox.name = "r"; 
      label.textContent = setOpt(coursesGetKeys[i], browser); 
      get.appendChild(checkBox); 
      get.appendChild(label); 
      //label.appendChild(document.createTextNode(setOpt(validCoursesKeys[i], dataset))); 
     } 
    } 

    if (browser == "rooms") { 
     for (var i = 1; i < validRoomsKeys.length; i++) { 
      var checkBox = document.createElement("input"); 
      var label = document.createElement("label"); 
      checkBox.type = "checkbox"; 
      checkBox.value = validRoomsKeys[i]; 
      checkBox.name = "r"; 
      label.textContent = setOpt(validRoomsKeys[i], browser); 
      get.appendChild(checkBox); 
      get.appendChild(label); 
      //label.appendChild(document.createTextNode(setOpt(validCoursesKeys[i], dataset))); 
     } 
    } 
}; 

Antwort

3

Sie bereits wissen, wie eine Eingabe zu erstellen:

var checkBox = document.createElement("input"); 

und wie es anhängen:

get.appendChild(checkBox); // get is the parent element you selected at the top of your code 

So Ihre erste Vermutung war richtig, können Sie dies auch tun können:

var br = document.createElement("br"); 
get.appendChild(br); 

was ein br elemen schafft t, und dann hängt es auch an die "Get" Eltern.

+0

Wo soll ich den Zeilenumbruch einfügen? Denn ich habe es am Anfang und am Ende der for-Schleifen versucht und es scheint nicht zu tun, was ich will. – stumpylumpy

+1

Am Ende jeder for-Schleife. Es gibt zwei Anweisungen, die 'appendChild' bereits enthalten. Ich würde die zwei Zeilen gleich danach setzen. Gibt es Fehlermeldungen in der Konsole Ihres Browsers? – amenthes

+0

Ahhh, danke. Es funktioniert jetzt. Ich habe nur eine br-Variable außerhalb der Schleife erstellt und dann versucht, sie innerhalb der Schleife wieder und wieder zu verwenden, so dass nur der Zeilenumbruch auf das letzte Element angewendet wurde! – stumpylumpy

Verwandte Themen