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来设置/获取已禁用的属性

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

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

FIDDLE

Answer 2

试试这个：

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

JSFiddle

Answer 3

试试这个：

$(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"  />

工作FIDDLE

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

如何使用JQuery禁用按钮？

4 个答案: