如何根据选中的复选框禁用文本框答案

【问题标题】：How to disable textbox depending on checkbox checked如何根据选中的复选框禁用文本框
【发布时间】：2023-03-30 15:33:01
【问题描述】：

谁能告诉我如何禁用文本框，如果复选框被选中，如果复选框未被选中，则启用文本框？

【问题讨论】：

标签： javascript

【解决方案1】：

把它放在复选框中：

onclick="document.getElementById('IdOfTheTextbox').disabled=this.checked;"

【讨论】：

【解决方案2】：

    <input type="text" id="textBox">
    <input type="checkbox" id="checkBox" onclick="enableDisable(this.checked, 'textBox')">
    <script language="javascript">
    function enableDisable(bEnable, textBoxID)
    {
         document.getElementById(textBoxID).disabled = !bEnable
    }
</script>

【讨论】：

【解决方案3】：

jQuery(document).ready(function () {
   $("#checkBox").click(function () {
      $('#textBox').attr("disabled", $(this).is(":checked"));
   });
});

【讨论】：

【解决方案4】：

像这样创建一个 Javascript 函数：

function EnableTextbox(ObjChkId,ObjTxtId)
{

    if(document.getElementById(ObjChkId).checked)
        document.getElementById(ObjTxtId).disabled = false;
    else
        document.getElementById(ObjTxtId).disabled = true;
}

在网格 RowDataBound 上创建一个像这样的 C# 函数：

protected void lstGrid_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        TextBox txtAllowed = (TextBox)e.Row.FindControl("txtAllowed");

        CheckBox chkAllowed = (CheckBox)e.Row.FindControl("RowSelector");
        chkAllowed.Attributes.Add("onClick", "EnableTextbox('" + chkAllowed.ClientID + "', '" + txtAllowed.ClientID + "')");
    }
}

【讨论】：

【解决方案5】：

对于这个简单的任务，我有最简单的解决方案。信不信由你

s = 1;
   function check(){
       o = document.getElementById('opt');
       if(o.value=='Y'){
           s++;
           if(s%2==0)
           $('#txt').prop('disabled',true);
           else
           $('#txt').prop('disabled',false);
       }
       
   }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Text: <input type="text" name="txt" id="txt">
<input type="checkbox" name="opt" id="opt" value="Y" onclick="check()">

这是代码。

【讨论】：

【解决方案6】：

<script type="text/javascript">
    function EnableDisableTextBox(chkPassport) {
        var txtPassportNumber = document.getElementById("txtPassportNumber");
       txtPassportNumber.disabled = chkPassport.checked ? false : true;
        if (!txtPassportNumber.disabled) {
            txtPassportNumber.focus();
        }
    }
</script>
<label for="chkPassport">
<input type="checkbox" id="chkPassport" onclick="EnableDisableTextBox(this)" />
Do you have Passport?
</label>
<br />
Passport Number:
<input type="text" id="txtPassportNumber" disabled="disabled" />

【讨论】：

【解决方案7】：

使用 jQuery：

$("#checkbox").click(function(){
  $("#textbox")[0].disabled = $(this).is(":checked");
});

【讨论】：

我真的不敢相信这个答案在没有工作的情况下存活了三年......要么在左侧使用$("#textbox")[0].disabled，要么将整行替换为$("#textbox").prop('disabled', ...); - 哦，为什么不在右侧使用this.checked？