チェックボックスに基づいてドロップダウン値を変更します

Question

私はちょっと立ち往生していません。私は回避策を作成する必要がある既存のボックス内で作業しています。説明を簡略化するために、基本的には、選択したチェックボックスの値をドロップダウンリストに入力します。

は、私は次のコードで動作することの基本を得ている：

<h4>Select a Date:</h4> 
<input type="checkbox" id="session_1" value="1" name="this">Session 1 
<br>  
<input type="checkbox" id="session_2" value="2" name="this">Session 2 
<br> 
<input type="checkbox" id="session_3" value="3" name="this">Session 3 
<br> 
<input type="checkbox" id="session_4" value="4" name="this">Session 4 
<br/> 
<input type="checkbox" id="session_5" value="5" name="this">Session 5 
<br> 
<input type="checkbox" id="session_6" value="6" name="this">Session 6 
<br> 
<br/><br/> 
<select id="hidden_select"> 
    <option>-</option> 
    <option>1</option> 
    <option>2</option> 
    <option>3</option> 
    <option>4</option> 
    <option>5</option> 
    <option>6</option> 
</select> 

とjQuery：

$(':checkbox').on('change',function(){ 
var th = $(this), name = th.prop('name'); 
if(th.is(':checked')){ 
    $(':checkbox[name="' + name + '"]').not($(this)).prop('checked',false); 
    } 
}); 

$('input#session_1').on('change', function() { 
     if ($(this).is(':checked')) { 
      $('#hidden_select>option:eq(1)').attr('selected', true); 
     } else { 
      $('#hidden_select>option:eq(1)').attr('selected', false); 
     } 
    }); 

$('input#session_2').on('change', function() { 
     if ($(this).is(':checked')) { 
      $('#hidden_select>option:eq(2)').attr('selected', true); 
     } else { 
      $('#hidden_select>option:eq(2)').attr('selected', false); 
     } 
    }); 

    $('input#session_3').on('change', function() { 
     if ($(this).is(':checked')) { 
      $('#hidden_select>option:eq(3)').attr('selected', true); 
     } else { 
      $('#hidden_select>option:eq(3)').attr('selected', false); 
     } 
    }); 

    $('input#session_4').on('change', function() { 
     if ($(this).is(':checked')) { 
      $('#hidden_select>option:eq(4)').attr('selected', true); 
     } else { 
      $('#hidden_select>option:eq(4)').attr('selected', false); 
     } 
    }); 

    $('input#session_5').on('change', function() { 
     if ($(this).is(':checked')) { 
      $('#hidden_select>option:eq(5)').attr('selected', true); 
     } else { 
      $('#hidden_select>option:eq(5)').attr('selected', false); 
     } 
    }); 

    $('input#session_6').on('change', function() { 
     if ($(this).is(':checked')) { 
      $('#hidden_select>option:eq(6)').attr('selected', true); 
     } else { 
      $('#hidden_select>option:eq(6)').attr('selected', false); 
     } 
    }); 

あなたはjsfiddle hereを見ることができます。

これは、1つのオプションをクリックして終了するか、順番に（1-6）順番に別のボックスをクリックすると機能しますが、あなたが気を変えて戻ると（1を選択してから4を1つに戻る）、ドロップダウンはもはや更新されない。

変更の認識を停止する理由についての考えはありますか？それを過ぎる方法はありますか？

Answer 1

selectのオプションは、別のチェックボックスをクリックしても選択されたままです。あなたはselectedへのいずれかのオプションを設定すると、あなたは他のオプションからselected属性を削除してください：ああhttps://jsfiddle.net/qnd75wmf/5/