Jquery 在满足某些条件之前，保持按钮处于禁用状态

我有5个

asp:TextBox

，其中4个的值之和不得超过第5个TextBox的值。在此之前，提交按钮必须保持禁用状态

这是控制装置

<td>
    <asp:TextBox ID="txtTotalSecurityDeposit" MaxLength="9" runat="server" onkeypress="return isNumber(event)" onfocus="words.innerHTML=convertNumberToWords(this.value)" onkeyup="words.innerHTML=convertNumberToWords(this.value)" onfocusout="myFunctionn()"></asp:TextBox>
                </td>

 <td style="width: 100px">

                <asp:TextBox class ="input" ID="txtAmount_VH" MaxLength="9" runat="server" Width="100px" Style="text-align: right" onkeypress="return isNumber(event)" onfocus="words.innerHTML=convertNumberToWords(this.value)" onkeyup="words.innerHTML=convertNumberToWords(this.value)" onfocusout="myFunctionn()"></asp:TextBox>
            </td>
            <td style="width: 100px">

                <asp:TextBox class ="input" ID="txtAmount_MX" MaxLength="9" runat="server" Width="100px" Style="text-align: right" onkeypress="return isNumber(event)" onfocus="words.innerHTML=convertNumberToWords(this.value)" onkeyup="words.innerHTML=convertNumberToWords(this.value)" onfocusout="myFunctionn()"></asp:TextBox>
            </td>
            <td style="width: 100px">

                <asp:TextBox class ="input" ID="txtAmount_OB" MaxLength="9" runat="server" Width="100px" Style="text-align: right" onkeypress="return isNumber(event)" onfocus="words.innerHTML=convertNumberToWords(this.value)" onkeyup="words.innerHTML=convertNumberToWords(this.value)" onfocusout="myFunctionn()"></asp:TextBox>
            </td>
            <td style="width: 100px">

                <asp:TextBox class ="input" ID="txtAmount_SP" MaxLength="9" runat="server" Width="100px" Style="text-align: right" onkeypress="return isNumber(event)" onfocus="words.innerHTML=convertNumberToWords(this.value)" onkeyup="words.innerHTML=convertNumberToWords(this.value)" onfocusout="myFunctionn()"></asp:TextBox>
            </td>
<td style="text-align: right">
                <asp:Button ID="btnAddAmount" runat="server" Text="Add" Width="92px" />
            </td>

这里是jQuery函数

<script type="text/javascript" src="Scripts/jquery-1.7.1.min.js"></script>

    <script type ="text/javascript">
        $(document).ready(function () {
            $('.input').on('keyup', function () {
                $vhamnt = $('#<%=txtAmount_VH%>').val();
                $mxamnt = $('#<%=txtAmount_MX%>').val();
                $obamnt = $('#<%=txtAmount_OB%>').val();
                $spamnt = $('#<%=txtAmount_SP%>').val();
                $totamnt = $('#<%=txtTotalSecurityDeposit%>').val();

                $sum = $vhamnt + $mxamnt + $obamnt + $spamnt;
                If(parseInt($sum) > parseInt($totamnt)) Then {
                    $('#<%=btnAddAmount.ClientID%>').attr("disabled", "disabled");
                }
            });
        });

    </script>

$（文档）.ready（函数（）{
$（'.input'）。在（'keyup'，函数（）{
$vhamnt=$（'#'）.val（）；
$mxamnt=$（'#'）.val（）；
$obamnt=$（'#'）.val（）；
$spamnt=$（'#'）.val（）；
$totamnt=$（'#'）.val（）；
$sum=$vhamnt+$mxamnt+$obamnt+$spamnt；
如果（parseInt（$sum）>parseInt（$totamnt）），那么{
$（'#'）.attr（“禁用”、“禁用”）；
}
});
});

Chrome的控制台也没有透露任何线索

创建一个保存逻辑的函数

从每个文本框onblur事件调用该函数

---

在mvc razor中测试了您的代码，在JS代码中几乎没有改动，这对我来说很有效

<script type="text/javascript" src="Scripts/jquery-1.7.1.min.js"></script>

    <script type ="text/javascript">
        $(document).ready(function () {
            $('.input').on('keyup', function () {
                $vhamnt = $('#txtAmount_VH').val();
                $mxamnt = $('#txtAmount_MX').val();
                $obamnt = $('#txtAmount_OB').val();
                $spamnt = $('#txtAmount_SP').val();
                $totamnt = $('#txtTotalSecurityDeposit').val();

                $sum = $vhamnt + $mxamnt + $obamnt + $spamnt;
                If(parseInt($sum) > parseInt($totamnt)) Then {
                    $('#btnAddAmount').attr("disabled", "disabled");
                }
            });
        });

    </script>

$（文档）.ready（函数（）{
$（'.input'）。在（'keyup'，函数（）{
$vhamnt=$（'#txtmount_VH'）.val（）；
$mxamnt=$（'#txtmount_MX'）.val（）；
$obamnt=$（'#txtmount_OB'）.val（）；
$spamnt=$（'#txtAmount_SP'）.val（）；
$totamnt=$（'#txtTotalSecurityDeposit'）.val（）；
$sum=$vhamnt+$mxamnt+$obamnt+$spamnt；
如果（parseInt（$sum）>parseInt（$totamnt）），那么{
$（'btnAddAmount'）.attr（“禁用”、“禁用”）；
}
});
});

No。同样的方法也适用于HTML控件，那么为什么要这样做呢？当然是这样。MVC中没有服务器端控件。我的标记和JS代码也适用于HTML控件。