使用JavaScript，下拉列表中的“填充”复选框从文本文件更改

Question

我有一个称为rcc的下拉列表和一些复选框组。 这是它的HTML代码。

<select id="rcc" name="rcc">
    <option value="Select Your Name">Select Your Name</option>
    <option value="p1">Person 1/option>
    <option value="p2">Person 2</option>
    <option value="p3">Person 3</option>                    
</select>

<input type="checkbox" name="time1[]" value="8:00am"/>8:00am
<input type="checkbox" name="time1[]" value="8:20am"/>8:20am
<input type="checkbox" name="time2[]" value="8:40am"/>8:40am
<input type="checkbox" name="time2[]" value="9:00am"/>9:00am
<input type="checkbox" name="time3[]" value="9:20am"/>9:20am
<input type="checkbox" name="time4[]" value="9:40am"/>9:40am

我还生成了一个文本文件，其中包含当某人在下拉列表中选择其他人时希望选择的时间。 例如，如果选择“人员1”，则要打开如下所示的p1times.txt：

time1
8:00am
time2
8:40am
9:00am
time4
9:40am

然后运行一个脚本，该脚本会自动填充页面上的相应复选框。 我当时想遍历文本文件，但不确定逻辑如何工作。 任何帮助将是巨大的:)。

Answer 1

我已经在http://jsfiddle.net/RHUdR/1上发布了一个示例。 我建议将您的时间存储为JSON。 如果要将这些文件放置在其他文件中，则只需像其他脚本文件一样将该文件包含在html中即可。

数据：

var people = {
    p1: { time1: [ '8:00am', '8:20am'], time4: ['9:40am'] },
    p2: { time2: [ '8:40am'], time3: ['9:20am'] },
    p3: { time1: [ '8:00am'], time2: ['9:00am'], time4: ['9:40am' ]}    
};

和一些jQuery来设置值：

$('#rcc').change(function() {
    var person = $(this).val();
    var times = people[person] || [];

    $('input[type="checkbox"]').attr('checked', false);
    for (var name in times) {
        var bucket = times[name];
        for(var i = 0, len = bucket.length; i < len; i++ ) {
            $('input[name="' + name + '"][value="' + bucket[i] + '"]')
                .attr('checked', true);
        }
    }        
});