Question

如果用户取消选中复选框并更改文本框的背景颜色，我想禁用文本框。如果用户选中该复选框，则该文本框应该是可编辑的，并更改为白色。这是代码

$(document).ready(function () {
    $(".ba").click(function () {
        $(".tex").css("background-color", "#CCCCCC");
    });
});

其中 .ba 是复选框， .tex 是文本框类，现在当用户点击它时会变为灰色，但如果再次点击则颜色不会改变。我想查看复选框是否被选中，如果已选中则不会发生任何其他情况，如果用户取消选中文本框背景颜色应该更改的复选框，它应该转到不可编辑的已禁用。任何人都可以帮忙吗？

我正在使用以下javascript检查所有内容并取消选中所有

function checkAll(formname, checktoggle) {
    var checkboxes = new Array(); 
    checkboxes = document[formname].getElementsByTagName('input');

    for (var i=0; i<checkboxes.length; i++)  {
        if (checkboxes[i].type == 'checkbox')   {
            checkboxes[i].checked = checktoggle;
        }
    }
}

这会导致任何问题吗？

Answer 1

Working jsFiddle Demo

考虑以下标记：

<input type="checkbox" class="ba" checked="checked" />
<input type="text" class="tex" />

你的JS：

$(function () {
    $('.ba').on('change', function () {
        var checked = $(this).prop('checked');
        $('.tex').prop('disabled', !checked);
    });
});

Answer 2

这是JS的代码

$(".ba").click(function () {
    if ($(".ba").is(":checked")) {
        $(".tex")
            .removeAttr("disabled")
            .css("background-color", "white");
    }
    else {
        $(".tex")
            .attr("disabled", "disabled")
            .css("background-color", "red");
    }
});

我建议你查看Jquery API。这是一个有趣的阅读：）

Answer 3

尝试

$(".ba").on('click',function() {
   if($(this).is(':checked'))
       $(".tex").css("background-color","#CCCCCC");
   else
       $('.tex').prop('disabled', false);
})'

Answer 4

$(document).ready(function(){
$(".ba").click(function() {
if ($('#check_id').is(":checked"))
{
  $(".tex").css("background-color","#CCCCCC");
}
else
{
   $(".tex").css("background-color","#DDDDDD");
}
});
});

如果使用jQuery选中复选框，如何禁用文本框？

4 个答案: