javascript - Javascript コードが機能しない

Question

チェックボックス（chk1）「オン/オフ」でパネルをアクティブ化/非アクティブ化しています。このパネルには、チェックボックス (chk2) とラジオボタン (rbtn) が含まれています。ラジオボタン (rbtn) がチェックされている場合は、チェックボックスを無効にする必要があります。「オン/オフ」チェックボックスをオフにしてパネルを無効にすると、ラジオボタンとチェックボックス (chk2) が無効になります。問題は、パネルを有効にしてページを開くと javascript のコードが実行されるが、パネルを無効にしてページを開くと、パネルを有効にした後、ラジオボタンをチェックして chk2無効になりました。

 $(document).ready(function (){
     $('input[id^=rbtn]').click(function () {
         SetControlEnableState($('#chk2'), $('#rbtn'));
     });
     function SetControlEnableState(controlToSet, control) {
         if (control.is(':checked')) {
            $(controlToSet).attr('disabled', 'disabled');
            alert('if');
         }
         else {
            $(controlToSet).removeAttr('disabled');
            alert('else');
        }
     }
});

パネルが更新されると、JavaScript コードは使用できなくなります。

score 3 · Accepted Answer

clickチェックボックスではイベントを使用しないでくださいchange。

    $('input[id^=rbtn]').change(function () {

このようにして、新しい状態を取得します。チェックボックスが変更される前にイベントclickが生成されます。

score 1 · Accepted Answer

これの代わりに：

$(controlToSet).attr('disabled', 'disabled');

$(controlToSet).removeAttr('disabled');

これを行う：

$(controlToSet).prop('disabled', true);

$(controlToSet).prop('disabled', false);

score 0 · Accepted Answer

全体を単純化します。

 $(document).ready(function () {
     $('input[id^=rbtn]').change(function () {
         SetControlEnableState($('#chk2'), $('#rbtn'));
     });

     function SetControlEnableState(controlToSet, control) {
         controlToSet.prop('disabled', control.is(':checked'));
     }
 });

score 0 · Accepted Answer

これを試して

$(document).ready(function (){
    $('input[id^=rbtn]').click(function () {
        SetControlEnableState($('#chk2'), $(this));
    });
    function SetControlEnableState(controlToSet, control) {
        if (control.is(':checked')) {
            $(controlToSet).attr('disabled', 'disabled');
        } else {
            $(controlToSet).removeAttr('disabled');
        }
    }
});

score 0 · Accepted Answer

$(document).ready(function (){

            $('input[id^=rbtn]').change(function () {
                SetControlEnableState();
            });
    function SetControlEnableState() {
        if ($('#rbtn').is(':checked')) {
            $('#chk2').attr('disabled', 'disabled');
            alert('if');
        }
        else {
            $('#chk2').removeAttr('disabled');
            alert('else');
        }
    }

javascript - Javascript コードが機能しない

5 に答える 5

Related

Reference