jQueryでセレクトボックスの操作　 #JavaScript

ラジオボタンでセレクトボックスの中身を動的に変更しつつ、
offにチェックを入れた場合にはdisabledを設定し選択出来なくなるようにする。
また、offに設定された場合には全てvalue="0"の要素になるようにする。
「Aの項目でYESと答えないとBの項目は入力できない」なんて時に使える。

sample.html

<!DOCTYPE html>
<html lang="ja">
    <head>
        <meta charset="utf-8">
        <title>Sample</title>
        <script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
        <script src="./sample.js"></script>
        <style>
            .nodisp{ display: none; }
        </style>
    </head>
    <body>
        <form>
            <div>
                <input type="radio" name="radio" value="1" checked="checked">on
            </div>
            <div>
                <input type="radio" name="radio" value="0">off
            </div>
            <div>
                <select id="select">
                </select>
            </div>
            <div>
                <button type="submit">送信</button>
            </div>
        </form>
        <select id="select_hidden" class="nodisp">
            <option value="0">選択できません</option>
            <option value="1">選択肢1</option>
            <option value="2">選択肢2</option>
            <option value="3">選択肢3</option>
        </select>
    </body>
</html>

sample.js

$(function() {
    changeSelect();

    $("input[name=radio]").on('change', function() {
        changeSelect();
    });
});

function changeSelect() {
    $("#select").empty();
    $("#select").append($("#select_hidden option").clone());

    if ($("input[name=radio]:checked").val() == 1) {
        $("#select").val(1);
        $("#select option[value=0]").remove();
        $("#select").removeAttr("disabled");
    } else if ($("input[name=radio]:checked").val() == 0) {
        $("#select").attr("disabled", "disabled");
        $("#select").val(0);
    }
}