wählen Sie die Option Wert var

Question

Also hier ist mein html

<select class="form-control" id="citizenType"> 
    <option value="value1">value1</option> 
    <option value="value2">value2</option> 
</select> 

und meine JS

$(document).ready(function() { 
    var value1 = new Array("1","2","3"); 
    var value2 = new Array("4","5","6"); 
    function grade(arr) { 
    $(arr).each(function(i) { 
     $("#grade").append("<option>" + arr[i].value + "</option>"); 
    }); 
    }; 

    $("#citizenType").change(function() { 
    var select = $("#citizenType option:selected").val(); 
    grade(select); 
    }); 
}); 

Warum arr nicht als Variable betrachtet, wenn passesd in grade()?

Answer 1

Das Problem ist, dass $("#citizenType option:selected").val() die Zeichenkette ist "value1" oder "value2". Also, wenn Sie es in die grade() Funktion übergeben, ruft es $("value1").each(...), die 0 Elemente zurückgibt und daher nichts tun. Hier ist, wie Sie Ihren Code ändern können, um das Ergebnis zu erzielen, die Sie suchen:

$(document).ready(function() { 
 
    var data = { 
 
    value1: new Array("1", "2", "3"), 
 
    value2: new Array("4", "5", "6") 
 
    }; 
 

 
    function grade(arr) { 
 
    $("#grade").empty(); // empty the options list before appending new options 
 
    $.each(arr, function(index, elem) { 
 
     $("#grade").append("<option>" + elem + "</option>"); 
 
    }); 
 
    }; 
 
    $("#citizenType").change(function() { 
 
    var select = $("#citizenType option:selected").val(); 
 
    grade(data[select]); // access data[selectedValue] to grab the correct array 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select class="form-control" id="citizenType"> 
 
    <option value="value1">value1</option> 
 
    <option value="value2">value2</option> 
 
</select> 
 

 
<select id="grade"></select>

Answer 2

Ihre Vars in einem Objekt wickeln und dann Klammer-Notation wie folgt aus zuzugreifen:

$(document).ready(function() { 
    var varWrapper = { 
    "value1": new Array("1","2","3"), // accessed using varWrapper["value1"] 
    "value2": new Array("4","5","6") // accessed using varWrapper["value2"] 
    // ... 
    }; 
    function grade(arr) { 
    // you may consider emptying #grade first using $("#grade").empty() 
    // $.each is better for looping arrays and objects 
    $.each(arr, function(i, value) { 
     $("#grade").append("<option>" + value + "</option>"); 
    }); 
    }; 
    $("#citizenType").change(function() { 
    var select = $("#citizenType option:selected").val(); 
     grade(varWrapper[select]); // access the according variable from varWrapper 
    }); 
}); 

Answer 3

In diesem Fall, dass Sie in der Callback-Funktion sind die passedtwo Werte sein kann. Der erste ist der 'i' Wert, den Sie verwenden (Dies ist der Index des Objekts im Array) und der zweite ist der Wert des Elements, auf dem Sie gerade arbeiten. Wenn Sie also über jeden Wert iterieren wollen und anhängen eine Option mit diesem Wert würden Sie brauchen, um so etwas zu tun:

$(arr).each(function(i, value) { 
     $("#grade").append("<option>" + value + "</option>"); 
    }); 

hier ist ein Link auf das Dokument der für diesen Teil der JQuery API: http://api.jquery.com/jquery.each/