0

別の選択ボックスで選択されたオプションに基づいて、ある選択ボックスで使用可能なオプションを動的に設定するために jQuery を使用しています。しかし、オプションを選択すると、次のエラーが表示されます。

Uncaught TypeError: Cannot use 'in' operator to search for '2' in entop_1

この例のエラーに「2」としてリストされている数と変数「entop_1」は、選択されたオプションに基づいて変化します。この問題に関するヘルプをいただければ幸いです。

現在、jQuery 2.0.0 分を使用しています。使用される形式は次のとおりです。

<form id="addForm">

<!-- Ent Select -->
<select id="ent_id" name="ent_id">
<option value="0">- Select -</option>
<option value="1">Ent 1</option>
<option value="2">Ent 2</option>
<option value="3">Ent 3</option>
</select>

<!-- Cat Select -->
<select id="cat_id" name="cat_id"></select>

</form>

スクリプトは次のとおりです。

<script type="text/javascript">
var entop_1 = {"- Select -": "0","Option A": "1","Option B": "2",};
var entop_2 = {"- Select -": "0","Option C": "3","Option D": "4",};
var entop_3 = {"- Select -": "0","Option E": "5","Option F": "6",};
$("#ent_id").change(function()
{
    var $cat_set = $("#cat_id");
    $cat_set.empty(); // remove old options
    var $ent_var = $("#ent_id option:selected").val();

    $.each('entop_' + $ent_var, function(key, value) {
        $cat_set.append($("<option></option>").attr("value", value).text(key));
    });

});
</script>
4

2 に答える 2

1

そのために使用できますeval。この行

$.each('entop_' + $ent_var, function(key, value) {

でなければなりません

 $.each(eval('entop_' + $ent_var), function(key, value) {

しかし、このアプローチには 2 つの問題があります。

  1. 評価は悪です。
  2. $.eachオブジェクトではなく、配列でのみ使用する必要があります。(length is undefinedエラーになります)

より良い方法は、次のように、データ オブジェクトを1 つのコレクションにフォーマットすることです。

var keys = {
    1: {
        "- Select -": "0",
        "Option A": "1",
        "Option B": "2",
    },
    2: {
        "- Select -": "0",
        "Option C": "3",
        "Option D": "4",
    },
    3: {
        "- Select -": "0",
        "Option E": "5",
        "Option F": "6",
    }
}

次に、使用できますfor..in

$("#ent_id").change(function () {
    var $cat_set = $("#cat_id");
    $cat_set.empty(); // remove old options
    var $ent_var = $("#ent_id option:selected").val();
    //find the corresponding value in object
    var options = keys[$ent_var];
    //    use for..in, not each
    for (var a in options) {
        $cat_set.append($("<option/>", {
            "text": a,
            "value": options[a]
        }));
    }
});

ただし、順序に注意してください。for..in配列を順番に通過しないことがあります。

デモ: http://jsfiddle.net/f6Jps/

于 2013-07-24T10:52:51.877 に答える
0

'entop_' + $ent_varが配列を参照する場合はeval、文字列を使用するか、配列がグローバルに配置されている場合は を使用window['entop_' + $ent_var]して、グローバルwindowオブジェクトから配列を取得します。

それ以外の場合、jQuery は文字列を反復しようとするだけだと思います。

変更されたコードの抜粋を次に示します。

$.each(eval('entop_' + $ent_var), function(key, value) {
    $cat_set.append($("<option></option>").attr("value", value).text(key));
});

また

$.each(window['entop_' + $ent_var], function(key, value) {
    $cat_set.append($("<option></option>").attr("value", value).text(key));
});
于 2013-07-24T10:51:17.993 に答える