0

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

また、ドロップダウンリストで誰かが別の人を選択したときに選択したい時間を含むテキストファイルを生成しました。たとえば、Person 1を選択した場合、次のようなp1times.txtを開きます。

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

次に、ページの対応するチェックボックスに自動的に入力するスクリプトを実行します。テキストファイルをループすることを考えていましたが、ロジックがどのように機能するかわかりません。どんな助けでも素晴らしいでしょう:)。

4

1 に答える 1

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);
        }
    }        
});
于 2012-04-29T20:09:48.290 に答える