如果使用jQuery选中复选框,如何禁用文本框? [英] How to disable a textbox if a checkbox is checked using jQuery?

查看:125
本文介绍了如果使用jQuery选中复选框,如何禁用文本框?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I want to disable a textbox if a user unchecks a checkbox and change the background colour of textbox. If the user checks the checkbox then that textbox should be editable and changes to white colour. Here is the code

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

其中 .ba 是复选框, .tex 是textbox类,现在当用户点击它变成灰色,但如果他们再次点击颜色不变。我想看看复选框是否被选中,如果它被选中,否则没有任何应该发生,如果用户取消选中复选框的文本框背景颜色应该更改,它应该转到不可编辑的禁用。任何人都可以帮助?

Where .ba is the checkbox and .tex is textbox classes, now when the user clicks it changes to grey color but if they click again the color not changing.I want to see if the check box is checked if it is checked then nothing should happen else if the user uncheck the check box the textbox background color should change and it should go to non-editable that is disabled.Can anyone help?

我使用下面的javascript来检查所有,取消选中所有

I am using Below javascript to check all and uncheck all

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;
        }
    }
}

这是否会导致任何问题?

Is this causes any problem?

推荐答案

以下是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 。这是一个有趣的阅读:)

I recommend you to check out Jquery API. It's a fun read :)

这篇关于如果使用jQuery选中复选框,如何禁用文本框?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆