jquery - 如何使用 JQuery 禁用按钮？

Question

我正在开发 MVC 应用程序。我有复选框和提交按钮。

我想在复选框的选中事件上启用提交按钮，而在未选中的提交按钮上应该禁用。

这个怎么做 ？

我有以下代码....

    @model PaymentAdviceEntity.Account
    @using PaymentAdviceEntity;


    @{
        ViewBag.Title = "Create";
        PaymentAdvice oPA = new PaymentAdvice();
        oPA = (PaymentAdvice)ViewBag.PaymentAdviceObject;

      <div>
             <input type="checkbox" class="optionChk" value="1" /> Paid
        </div>

    <input type="submit" value="Create"  />
    <input type="button"  class="btn-primary" />
    }

    <script type="text/javascript">
$(".optionChk").on("change", function () {
    if ($(this).is(":checked"))
    {
        alert("1");

        $(".SubmitButton").attr("disabled", "disabled"); 
    } else 
    {
        alert("2");

        $(".SubmitButton").attr("enable", "enable"); 
    }    
});
</script>

Answer 1

您应该使用prop来设置/获取 disabled 属性

$(".optionChk").on("change", function () {
     $("input[type=submit]").prop("disabled",!this.checked);   
});

此外，您的提交按钮没有 class='Submit' 因此您需要使用属性选择器.. 或给它 class='Submit' 并使用$('.Submit')代替$('input[type=submit]')

小提琴

Answer 2

尝试这个：

$(function(){
    $('.optionChk').click(function(){
        $('input[type="submit"]').toggle('fast');
    });

});

和 HTML：

<div>
         <input type="checkbox" class="optionChk" value="1" checked="checked" /> Paid
    </div>

<input type="submit" value="Create"  />

工作小提琴

Answer 3

尝试这个：

$(".optionChk").on("change", function () {
    if ($(this).is(":checked")) {
        $("input[type=submit]").removeAttr("disabled");
    } else {
        $("input[type=submit]").attr("disabled", "disabled");
    }    
});

JSFiddle

Answer 4

禁用提交按钮：

$(".optionChk").on("change", function () {

if ($(this).is(":checked")) 
{
$("input[type='submit']").attr('disabled',false); //button will be enabled
}
else
{
$("input[type='submit']").attr('disabled',true); //button will be disabled
}
})

启用或禁用提交按钮的代码：

$("input[type='submit']").attr('disabled',true); //button will be disabled