はVAR

Question

に選択オプションの値を変換しますので、ここでgrade()にpassesdときarrが変数として考慮されていないのはなぜ私のhtml

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

と私の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); 
    }); 
}); 

ですか？

Answer 1

問題が$("#citizenType option:selected").val()は、文字列リテラル"value1"または"value2"であるということです。だから、それをgrade()関数に渡すと、それは0の要素を返すので、何もしないで、$("value1").each(...)を呼び出しています。ここでは、あなたが探している結果を達成するためにコードを変更することができます方法は次のとおりです。

この場合

$(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

オブジェクトであなたのVARSをラップしてから、次のようにブラケット表記を使用してアクセス：

$(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

あなたはpassedtwo値でできるコールバック関数内です。最初の値は使用している 'i'の値です（これは配列内のオブジェクトのインデックスです）。2番目の値は現在動作しているアイテムの値です。したがって、各値を繰り返したい場合は、 「http://api.jquery.com/jquery.each/