0

私はJSONオブジェクトを持っています

var jsonString =[
    {
        "key": "Monday, June 18, 2012",
        "value": "10 00 AM|_mod,11 00 AM|_mod,12 00 PM|_mod,13 00 PM|_mod"
    },
    {
        "key": "Tuesday, June 19, 2012",
        "value": "13 00 PM|_mod,13 30 PM|_mod,14 00 PM|_mod,14 30 PM|_mod,15 00 PM|_mod"
    }
];

最初のドロップダウンから選択したキーを JSON のキーと一致させ、2 番目のドロップダウンに適切な値を設定しようとしている 2 つのドロップダウンがあります。オプションタグをこのようにしたい

<option value="10 00 AM|_mod">10 00 AM</option>

しかし、私はこれを見ています

ここに画像の説明を入力

10 00 AM|_mod の空のスペースが、DOM の作成時に問題を引き起こしていると思います。

これは私のJSコードです。

$('#event_date').change(function() {
    var event_date = $("#event_date").val(); // first drop-down val
    var time_type = null;
    var time = null;
    for (var x = 0; x < jsonString.length; x++) {
        if (event_date == jsonString[x].key) {
            var value = jsonString[x].value;
            console.log(value);  // output: 10 00 AM|_mod,11 00 AM|_mod,12 00 PM|_mod,13 00 PM|_mod
            var value_split = value.split(",");
            for (var i = 0; i < value_split.length; i++) {
                console.log(value_split[i]);    // works fine at index 0 I get 10 00 AM|_mod
                time_type = value_split[i].split("|");
                time = time_type[0];
                $('#timeslotIdentifier').append("<option value =" + value_split[i] + ">" + time + "</option>");
            };
        };
    };
});

エンコーディングの問題はありますか? ブレークポイントを追加しようとしましたが、問題ないように見えますが、要素を調べるとこれが表示されます。

ここに画像の説明を入力

4

3 に答える 3

4

引用符で囲まれていない属性値を作成しています。

代わりに jQuery を使用する必要があります。

$('<option />').text(time).val(value_split[i]).appendTo('#timeslotIdentifier');
于 2012-06-06T22:20:13.063 に答える
1

この場合、 jQueryの.val()方が間違いなく優れていますが、エラーがどこにあるかわからない場合は、次のようになります。

//Nope. (Missing quotes in HTML)
$('#timeslotIdentifier')
    .append("<option value =" + value_split[i] + ">" + time + "</option>");

//Yep.
$('#timeslotIdentifier')
    .append("<option value =\"" + value_split[i] + "\">" + time + "</option>");
于 2012-06-06T23:27:49.200 に答える
1
$('#event_date').change(function() {
    var event_date = $("#event_date").val(); // first drop-down val
    var time_type = null;
    var time = null;
    for (var x = 0; x < jsonString.length; x++) {
        if (event_date == jsonString[x].key) {
            var value = jsonString[x].value;
            console.log(value);  // output: 10 00 AM|_mod,11 00 AM|_mod,12 00 PM|_mod,13 00 PM|_mod
            var value_split = value.split(",");
            for (var i = 0; i < value_split.length; i++) {
                console.log(value_split[i]);    // works fine at index 0 I get 10 00 AM|_mod
                time_type = value_split[i].split("|");
                time = time_type[0];
                $('#timeslotIdentifier').append($("<option>").attr({value: value_split[i]}).text(time));
            };
        };
    };
});
于 2012-06-06T22:26:29.633 に答える