復選框的jQuery代碼啟用禁用

Question

嗨，我想將javascript函數代碼轉換為jquery。 有人能幫忙嗎 ？ 以下是我的HTML代碼的JavaScript函數。

 <script type="text/javascript">
    function enableTextBox() {
        if (document.getElementById("chkCropLoan").checked == true)
            document.getElementById("txtAmount").disabled = false;
        else
            document.getElementById("txtAmount").disabled = true;
        if (document.getElementById("chkInvestmentLoan").checked == true)
            document.getElementById("txtInvestmentLoan").disabled = false;
        else
            document.getElementById("txtInvestmentLoan").disabled = true;

        if (document.getElementById("chkWarehouseReceipt").checked == true)
            document.getElementById("txtWarehouseReceipt").disabled = false;
        else
            document.getElementById("txtWarehouseReceipt").disabled = true;

        if (document.getElementById("chkFarmerProd").checked == true)
            document.getElementById("txtFarmerProd").disabled = false;
        else
            document.getElementById("txtFarmerProd").disabled = true;
    }
</script>

HTML代碼從此處開始用於復選框和文本框

<table>
    <tr>
        <td>Crop Loan</td>
        <td>
            <%--<asp:TextBox ID="TextBox1" runat="server" class="txtfld-popup1" MaxLength="10" onkeypress="if(event.keyCode<48 || event.keyCode>57)event.returnValue=false;"></asp:TextBox>--%>
                <asp:CheckBox ID="chkCropLoan" runat="server" CssClass="check" OnChange="javascript:enableTextBox();" />
        </td>
    </tr>
    <tr>
        <td>Amount</td>
        <td>
            <%--<asp:TextBox ID="TextBox1" runat="server" class="txtfld-popup1" MaxLength="10" onkeypress="if(event.keyCode<48 || event.keyCode>57)event.returnValue=false;"></asp:TextBox>--%>
                <asp:TextBox ID="txtAmount" runat="server" class="txtfld-popup1" MaxLength="5" onkeypress="if(event.keyCode<48 || event.keyCode>57)event.returnValue=false;" Enabled="false"></asp:TextBox>
                <%-- <cc1:TextBoxWatermarkExtender ID="txtAmount_TextBoxWatermarkExtender" runat="server" TargetControlID="txtAmount" WatermarkText="Enter Crop loan Amount"></cc1:TextBoxWatermarkExtender>--%>
                    <asp:RegularExpressionValidator ID="rgfldvalidator" ControlToValidate="txtAmount" runat="server" ErrorMessage="Please enter the numbers only" ValidationExpression="^[0-9]*\.?[0-9]+$"></asp:RegularExpressionValidator>
        </td>
    </tr>
    <tr>
        <td>Investment Loan</td>
        <td>
            <%--<asp:TextBox ID="TextBox1" runat="server" class="txtfld-popup1" MaxLength="10" onkeypress="if(event.keyCode<48 || event.keyCode>57)event.returnValue=false;"></asp:TextBox>--%>
                <asp:CheckBox ID="chkInvestmentLoan" runat="server" CssClass="check" OnChange="javascript:enableTextBox();" />
        </td>
    </tr>
    <tr>
        <td>Amount</td>
        <td>
            <%--<asp:TextBox ID="TextBox1" runat="server" class="txtfld-popup1" MaxLength="10" onkeypress="if(event.keyCode<48 || event.keyCode>57)event.returnValue=false;"></asp:TextBox>--%>
                <asp:TextBox ID="txtInvestmentLoan" runat="server" class="txtfld-popup1" MaxLength="5" onkeypress="if(event.keyCode<48 || event.keyCode>57)event.returnValue=false;" Enabled="false"></asp:TextBox>
                <%--<cc1:TextBoxWatermarkExtender ID="txtInvestmentLoan_TextBoxWatermarkExtender" runat="server" TargetControlID="txtInvestmentLoan" WatermarkText="Enter Investment loan Amount"></cc1:TextBoxWatermarkExtender>--%>
                    <asp:RegularExpressionValidator ID="RegularExpressionValidator3" ControlToValidate="txtInvestmentLoan" runat="server" ErrorMessage="Please enter the numbers only" ValidationExpression="^[0-9]*\.?[0-9]+$"></asp:RegularExpressionValidator>
        </td>
    </tr>
    <tr>
        <td>Warehouse Receipt Finance</td>
        <td>
            <%--<asp:TextBox ID="TextBox1" runat="server" class="txtfld-popup1" MaxLength="10" onkeypress="if(event.keyCode<48 || event.keyCode>57)event.returnValue=false;"></asp:TextBox>--%>
                <asp:CheckBox ID="chkWarehouseReceipt" runat="server" CssClass="check" OnChange="javascript:enableTextBox();" />
        </td>
    </tr>
    <tr>
        <td>Amount</td>
        <td>
            <%--<asp:TextBox ID="TextBox1" runat="server" class="txtfld-popup1" MaxLength="10" onkeypress="if(event.keyCode<48 || event.keyCode>57)event.returnValue=false;"></asp:TextBox>--%>
                <asp:TextBox ID="txtWarehouseReceipt" runat="server" class="txtfld-popup1" MaxLength="5" onkeypress="if(event.keyCode<48 || event.keyCode>57)event.returnValue=false;" Enabled="false"></asp:TextBox>
                <%--<cc1:TextBoxWatermarkExtender ID="txtWarehouseReceipt_TextBoxWatermarkExtender" runat="server" TargetControlID="txtWarehouseReceipt" WatermarkText="Enter Warehouse Receipt Finance Amount"></cc1:TextBoxWatermarkExtender>--%>
                    <asp:RegularExpressionValidator ID="RegularExpressionValidator4" ControlToValidate="txtWarehouseReceipt" runat="server" ErrorMessage="Please enter the numbers only" ValidationExpression="^[0-9]*\.?[0-9]+$"></asp:RegularExpressionValidator>
        </td>
    </tr>
    <tr>
        <td>Farmer Producer Companies</td>
        <td>
            <%--<asp:TextBox ID="TextBox1" runat="server" class="txtfld-popup1" MaxLength="10" onkeypress="if(event.keyCode<48 || event.keyCode>57)event.returnValue=false;"></asp:TextBox>--%>
                <asp:CheckBox ID="chkFarmerProd" runat="server" CssClass="check" OnChange="javascript:enableTextBox();" />
        </td>
    </tr>
    <tr>
        <td>Amount</td>
        <td>
            <%--<asp:TextBox ID="TextBox1" runat="server" class="txtfld-popup1" MaxLength="10" onkeypress="if(event.keyCode<48 || event.keyCode>57)event.returnValue=false;"></asp:TextBox>--%>
                <asp:TextBox ID="txtFarmerProd" runat="server" class="txtfld-popup1" MaxLength="5" onkeypress="if(event.keyCode<48 || event.keyCode>57)event.returnValue=false;" Enabled="false"></asp:TextBox>
                <%--<cc1:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender11" runat="server" TargetControlID="txtFarmerProd" WatermarkText="Enter Farmer Producer Amount"></cc1:TextBoxWatermarkExtender>--%>
                    <asp:RegularExpressionValidator ID="RegularExpressionValidator5" ControlToValidate="txtFarmerProd" runat="server" ErrorMessage="Please enter the numbers only" ValidationExpression="^[0-9]*\.?[0-9]+$"></asp:RegularExpressionValidator>
        </td>
    </tr>
</table>

Answer 1

嘗試此操作，如果您使用母版頁，則可能需要在以下代碼中更改ID

function enableTextBox() {

    if ($("#chkCropLoan").prop("checked") == true)
        $("#txtAmount").prop("disabled", false);
    else
        $("#txtAmount").prop("disabled", true);

    if ($("#chkInvestmentLoan").prop("checked") == true)
        $("#txtInvestmentLoan").prop("disabled", false);
    else
        $("#txtInvestmentLoan").prop("disabled", true);

    if ($("#chkWarehouseReceipt").prop("checked") == true)
        $("#txtWarehouseReceipt").prop("disabled", false);
    else
        $("#txtWarehouseReceipt").prop("disabled", true);

    if ($("#chkFarmerProd").prop("checked") == true)
        $("#txtFarmerProd").prop("disabled", false);
    else
        $("#txtFarmerProd").prop("disabled", true);
}