Javascript - Remove Split-Methode

Ich versuche, die Select-Anwendung nur mit Javascipt erstellen. Ich habe über diesen Code im Internet erfahren und es verwendet die Split-Methode, um Wert und .innerHTML zurückzugeben. Sag jetzt, wenn ich nicht die Split-Methode verwenden und nur mit .innerHTML in html-Element ohne Wert zurückkehren möchte, wie das mit for-Schleife wie in diesem Code verwendet wird?Javascript - Remove Split-Methode

<!DOCTYPE html> 
<html> 
<head> 
    <title>Select Options</title> 
</head> 
<body> 

<h2>Choose your car</h2> 
<hr> 

Choose Car Make: 
<select id="slct1" onchange="populate(this.id,'slct2')"> 
    <option value=""></option> 
    <option value="Hyundai">Hyundai</option> 
    <option value="Honda">Honda</option> 
    <option value="Maruti">Maruti</option> 
</select> 

<hr> 

Choose Car Model 
<select id="slct2" ></select> 

</body> 

<script type="text/javascript"> 
    function populate(s1,s2){ 
     var s1 = document.getElementById(s1); 
     var s2 = document.getElementById(s2); 
     s2.innerHTML = ""; 

     if(s1.value == "Hyundai") { 
      var optionArray = ["|", "i10|i10","i20|i20", "Verna|Verna"] 
     } 
     for(var option in optionArray){ 
      var pair = optionArray[option].split("|"); 
      var newOption = document.createElement('option'); 
      newOption.value = pair[0]; 
      newOption.innerHTML = pair[1]; 
      s2.options.add(newOption); 
     } 
    } 
</script> 

</html>

Quelle

2017-04-01 Aseem Sharma

so nicht die Split-Methode verwenden? Stellen Sie einfach die innereHTML ... – epascarello

Sie müssen sich bewusst sein, dass for... in Schleife über ein Array verwenden, werden Sie nicht wieder die Elemente tatsächlich, aber ihre Indizes. Ich würde vorschlagen, dass Sie stattdessen einfach for Schleife verwenden.

function populate(s1, s2) { 
 
    var s1 = document.getElementById(s1); 
 
    var s2 = document.getElementById(s2); 
 
    s2.innerHTML = ""; 
 
    
 
    var optionArray = ["i10", "i20", "Verna"]; 
 
    
 
    for (var i = 0; i < optionArray.length; i++) { 
 
    var newOption = document.createElement('option'); 
 
    newOption.value = optionArray[i]; 
 
    newOption.innerHTML = optionArray[i]; 
 
    s2.appendChild(newOption); 
 
    } 
 
}

<h2>Choose your car</h2> 
 
<hr> Choose Car Make: 
 
<select id="slct1" onchange="populate('slct1','slct2')"> 
 
    <option value=""></option> 
 
    <option value="Hyundai">Hyundai</option> 
 
    <option value="Honda">Honda</option> 
 
    <option value="Maruti">Maruti</option> 
 
</select> 
 

 
<hr> Choose Car Model 
 
<select id="slct2"></select>

Quelle

2017-04-01 15:28:37

Danke! Ich habe den Code –

Entfernen oder einfach kommentieren (können Sie es in Zukunft erfordern würde) einige Zeilen sollte das tun, was Sie wollen:

<script type="text/javascript"> 
    function populate(s1,s2){ 
     var s1 = document.getElementById(s1); 
     var s2 = document.getElementById(s2); 
     s2.innerHTML = ""; 

     if(s1.value == "Hyundai") { 
      var optionArray = ["|", "i10|i10","i20|i20", "Verna|Verna"] 
     } 
     for(var option in optionArray){ 
      var pair = optionArray[option]; //.split("|"); 
      var newOption = document.createElement('option'); 
      newOption.value = pair; //[0]; 
      newOption.innerHTML = pair; //[1]; 
      s2.options.add(newOption); 
     } 
    } 
</script>

Mit obigen Code, werden Sie keine .split() verwenden und die Zuweisung nur die ganze Objekt auf das neue Element.

Quelle

2017-04-01 15:22:28

Danke Freund. Ich habe den Code und es funktioniert wirklich gut. Vielen Dank für Ihre Zeit –

Wenn die obige Antwort Ihnen geholfen hat. Sie können es als akzeptierte Antwort auswählen. –

Okay, aber ich brauche jetzt noch mehr Hilfe –

Linke Wert zu "", um es leer zu halten.

for(var option in optionArray){ 
    var text = optionArray[option]; 
    var newOption = document.createElement('option'); 
    newOption.value = ""; 
    newOption.innerHTML = text; 
    s2.options.add(newOption, null); 
}

Quelle

2017-04-01 15:23:49

Danke für den Vorschlag Knospe! Ich schätze Ihre Zeit –

Javascript - Remove Split-Methode

Antwort

Verwandte Themen