Javascript 在jquery中选择单选按钮时启用/禁用按钮_Javascript_Jquery

Javascript 在jquery中选择单选按钮时启用/禁用按钮

javascript jquery

Javascript 在jquery中选择单选按钮时启用/禁用按钮,javascript,jquery,Javascript,Jquery,我有一个页面，其中有两个单选按钮和一个下一步按钮。我已禁用“下一步”按钮，仅当我选择任何单选按钮时才启用该按钮。但是现在，当我转到另一个页面并返回到此页面时，“下一步”按钮被禁用，尽管单选按钮已被选中。PFB代码 $(document).ready(function () { $('#commandButton_1_0').attr('disabled', 'true'); $('input:radio[name=a_SignatureOption]').click(func

我有一个页面，其中有两个单选按钮和一个下一步按钮。我已禁用“下一步”按钮，仅当我选择任何单选按钮时才启用该按钮。但是现在，当我转到另一个页面并返回到此页面时，“下一步”按钮被禁用，尽管单选按钮已被选中。PFB代码

$(document).ready(function () {
     $('#commandButton_1_0').attr('disabled', 'true');
     $('input:radio[name=a_SignatureOption]').click(function () {
         var checkval = $('input:radio[name=a_SignatureOption]:checked').val();
         if (checkval == '1' || checkval == '2') {
             $('#commandButton_1_0').removeAttr('disabled');
         }
     });
});

试一试

演示：

加载文档时，您需要检查是否单击了单选按钮

$(document).ready(function() {
  $('input:radio[name=a_SignatureOption]').each(function() {
         checked(this);
  });

  $('input:radio[name=a_SignatureOption]').click(function() {
    checked(this);
  });

  function checked(obj){
    if($(obj).is(':checked')) {
        $('#commandButton_1_0').removeAttr('disabled');
    }else{
        $('#commandButton_1_0').attr('disabled', 'true');
    }
  }
});

我花了时间去理解你的问题

这可以通过在加载页面时取消选中收音机来解决

$(document).ready(function () {
    $('input:radio[name=a_SignatureOption]').prop('checked', false);
    $('#commandButton_1_0').attr('disabled', 'true');  
    $('input:radio[name=a_SignatureOption]').click(function () {
    var checkval = $('input:radio[name=a_SignatureOption]:checked').val();
    if (checkval == '1' || checkval == '2') {
        $('#commandButton_1_0').removeAttr('disabled');
    }
});
});

退房，顺便说一句，重定向到其他站点，然后按后退按钮查找差异

希望你能理解。

//试试这个

$(document).ready(function () {
$("input:radio[name=a_SignatureOption]").removeAttr('checked'); 
$('#commandButton_1_0').attr("disabled","disabled");

 $('input:radio[name=a_SignatureOption]').click(function () {
    var checkval = $('input:radio[name=a_SignatureOption]:checked').val();   
     if (checkval == '1' || checkval == '2') {

         $('#commandButton_1_0').removeAttr("disabled","disabled");
     }
 });

}))

你的问题很简单

<form name="urfrm">
<input type="radio" value="1" name="a_SignatureOption"> Yes<br>
<input type="radio" value="2" name="a_SignatureOption"> No<br>
<input type="submit" id="butn" name="butn" value="next" disabled><br>
</form>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
    //This will check the status of radio button onload
    $('input[name=a_SignatureOption]:checked').each(function() {
        $("#butn").attr('disabled',false);
    });

    //This will check the status of radio button onclick
    $('input[name=a_SignatureOption]').click(function() {
        $("#butn").attr('disabled',false);
    });
});
</script>


是

否



$（文档）.ready（函数（）{
//这将检查单选按钮onload的状态
$（'input[name=a_SignatureOption]：选中'）。每个（函数（）{
$（“#butn”）.attr（'disabled'，false）；
});
//这将检查单选按钮onclick的状态
$（'input[name=a_SignatureOption]'）。单击（函数（）{
$（“#butn”）.attr（'disabled'，false）；
});
});

我能想到的最简单的解决方案是：

// selects all input elements, whose name is 'a_SignatureOption' and whose
// type is 'radio'
// binds a change event-handler, using 'on()':
$('input[name=a_SignatureOption][type="radio"]').on('change', function(){
    // sets the 'disabled' property of the button to 'true' if zero radio inputs
    // are checked, or to false if one is checked:
    $('#commandButton_1_0').prop('disabled', $('input[name=a_SignatureOption][type="radio"]:checked').length === 0);
// triggers the change event-handler on page load:
}).change();

参考资料：

开始时忘记检查按钮

$(document).ready(function () {
    $('#commandButton_1_0').attr('disabled', 'true');
    if( $('input[name=a_SignatureOption]:checked' ).size() > 0 ) {
       $('#commandButton_1_0').removeAttr('disabled');
    }
    $('input[name=a_SignatureOption]').click(function () {
        if( $('input:radio[name=a_SignatureOption]:checked' ).size() > 0 ) {
            $('#commandButton_1_0').removeAttr('disabled');
        }
    });
});

顺便说一下，我总是建议添加类以形成元素并使用这些元素，而不是使用[name=“…”]。它更快、更简单，您可以更改输入名称（如果需要），而无需触摸js

    <html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>

<script>
    $(document).ready(function () {
        $('#commandButton_1_0').attr('disabled', 'true');

        $('input:radio[name=a_SignatureOption]').click(function () {
            var checkval = $('input:radio[name=a_SignatureOption]:checked').val();
            alert(checkval)
            if (checkval == '1' || checkval == '2') {
                $('#commandButton_1_0').removeAttr('disabled');
            }
            else {
                $('#commandButton_1_0').attr('disabled', 'disabled');
            }
        });
    });
</script>
</head>
<body>
  <input type="radio" name="a_SignatureOption" value="1" /> value1
    <br />
    <input type="radio" name="a_SignatureOption" value="2"/> value2
    <br />
    <input type="radio" name="a_SignatureOption" value="3" checked="checked"/> value3
    <br />
    <input type="button" id="commandButton_1_0" value="Next"/>
</body>
</html>

$（文档）.ready（函数（）{ $（'#commandButton_1_0'）.attr（'disabled'，'true'）； $（'input:radio[name=a_SignatureOption]'）。单击（函数（）{ var checkval=$（'input:radio[name=a_SignatureOption]：checked'）.val（）；警报（checkval）如果（checkval='1'| | checkval=='2'）{ $（'#commandButton_1_0'）。removeAttr（'disabled'）； } 否则{ $（'#commandButton_1_0'）.attr（'disabled'，'disabled'）； } }); }); 价值1
价值2
价值3

您可以为相同的对象创建JSFIDLE吗？

    <html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>

<script>
    $(document).ready(function () {
        $('#commandButton_1_0').attr('disabled', 'true');

        $('input:radio[name=a_SignatureOption]').click(function () {
            var checkval = $('input:radio[name=a_SignatureOption]:checked').val();
            alert(checkval)
            if (checkval == '1' || checkval == '2') {
                $('#commandButton_1_0').removeAttr('disabled');
            }
            else {
                $('#commandButton_1_0').attr('disabled', 'disabled');
            }
        });
    });
</script>
</head>
<body>
  <input type="radio" name="a_SignatureOption" value="1" /> value1
    <br />
    <input type="radio" name="a_SignatureOption" value="2"/> value2
    <br />
    <input type="radio" name="a_SignatureOption" value="3" checked="checked"/> value3
    <br />
    <input type="button" id="commandButton_1_0" value="Next"/>
</body>
</html>