JavaScript小技集

JavaScriptでできる小技をサンプル付きで紹介しています。

ラジオボタンのグループ全体を非活性にするのは簡単ですが、JavaScriptで一から作成するのはなかなか大変です。。。
しかし、jQueryを使えば楽に実装できます。
仕組みとしては、jQueryのセレクタで非活性にしたいラジオボタンの項目をピンポイントでdisabled属性を指定するというものになります。

動作確認用サンプル

活性ラジオ1 活性ラジオ2 非活性ラジオ

コードサンプル

<html>
    <head>
        <title>ラジオボタンの一部の項目を非活性にするサンプル</title>
        <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
        <script>
            $(function () {
                $('#disRadio1').prop('disabled', true);
            });
        </script>
    </head>
    <body>
    </body>
        <label><input type="radio" id="enaRadio1" name="sampleRadio" value="ena1" checked="checked"/>活性ラジオ1</label>
        <label><input type="radio" id="enaRadio2" name="sampleRadio" value="ena2"/>活性ラジオ2</label>
        <label><input type="radio" id="disRadio1" name="sampleRadio" value="dis1"/>非活性ラジオ</label>
    </body>
</html>

JavaScript小技集

目次

ラジオボタンの一部の項目のみ非活性にする

動作確認用サンプル

コードサンプル

作成中