0

在这个程序中,当未选中复选框时,我需要禁用 Html 按钮。仅在选择复选框时才能启用按钮。我使用 Jquery 1.8.3 版。然而,在这个程序中,启用和禁用之间的交换没有按我的预期工作。

//-------- HTML

    <body>
Some agreement here
<p>
    <input type="checkbox" id="agree" />
</p>
<input type="button" value="Continue" disabled="disabled" id="continue"/>

<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
<script type="text/javascript" src="js/class.js"></script>  
</body>

//--------JQuery

$(document).ready(function(){
    $('#agree').change(function(){
        state = $(this).attr('value');
        if(state == 'on'){
            $('#continue').removeAttr('disabled');
        }else if(state == ''){
            $('#continue').attr('disabled','disabled');
        }

    });
});
4

6 回答 6

2

对于disabled(and checked),您应该改用.prop()

$("#continue").prop("disabled",true);

虽然如果您让我们知道究竟是什么没有按预期工作会有所帮助

于 2013-07-30T16:17:26.730 回答
1

请尝试以下功能:

$(document).ready(function(){
    $('#agree').change(function(){
        var checked = $(this).prop('checked')
        if(checked){
            $('#continue').removeAttr('disabled');
        }else{
            $('#continue').attr('disabled','disabled');
        }
    });
});

看到这个小提琴。

总之,您正在检查 的,该值#agree在任何时候都没有设置。prop()是确定是否选中复选框的更好方法。prop()要么返回true要么false,让事情变得更容易。

于 2013-07-30T16:19:49.177 回答
1
$(document).ready(function(){
    $('#agree').change(function(){
        if($(this).is(":checked")){
            $('#continue').removeAttr('disabled');
        }else{
            $('#continue').attr('disabled','disabled');
        }

    });
});
于 2013-07-30T16:25:33.863 回答
0
$(document).ready(function(){
        $('#agree').click(function(){
           $("#continue").attr("disabled", !this.checked);

        });
    });

我希望这会有所帮助。见小提琴

于 2013-07-30T16:28:31.210 回答
0

一种简单的方法是使用this.checked或使用$(this).is(":checked")withprop来操作input:button

 $('#agree').change(function () {
     $("#continue").prop("disabled", !$(this).is(":checked"));
     //$("#continue").prop("disabled", !this.checked);
 });

演示:http: //jsfiddle.net/hungerpain/p9u7Y/

于 2013-07-30T16:28:40.890 回答
0

disabled 属性后面不需要一个="disabled"。做就是了:

<input type="button" value="Continue" disabled />

.prop('disabled', true)无论如何,你应该使用它。以及.removeProp()

于 2013-07-30T16:18:20.140 回答