Question

我想知道如何将一个按钮变灰，直到所有文本框在ASP.NET和C＃中都有文本。在下图中，我想将提交按钮变灰。干杯，克里斯！

enter image description here

Answer 1

您可以尝试类似这样的

检查每个输入元素是否具有该值，并创建一个全局变量，当所有输入值都为真时。

现在在此变量为true时启用按钮。

 $('input').keyup(function() {

        var isEntryPresent = false;
        $('input').each(function() {
            if ($(this).val() == '') {
                isEntryPresent = true;
            }
        });

        if (isEntryPresent) {
            $('#commitInventory').attr('disabled', 'disabled');
        } else {
            $('#commitInventory').removeAttr('disabled');
        }
    });

Js Fiddle Demo

如果页面上存在任何其他输入元素，则可能需要使用更具体的输入选择器。所以你应该根据自己的情况使用特定的选择器。

Answer 2

您可以使用“更改”事件而不是每个keyup / keydown执行此操作。此外，您可以使用过滤器来简化检查任何空输入的代码。

View Demo

$(document).ready(function(){
  $("input").on("change", function(){        
    $("#inp-submit").prop("disabled", anyEmptyInputs());         
  });
});

function anyEmptyInputs(){
     var empty = $("input").filter(function() { return this.value === ""; });
    return empty.length > 0;
}

Answer 3

由于您在此处标记了JavaScript以及ASP.NET，我假设您也在客户端执行此操作，或者可以在客户端执行此操作，下面您可以从JSFiddle运行代码Live

点击此处查看Live JsFiddle Demo。

如果你在JsFiddle上运行代码，它基本上将所有TextBox都附加到“KeyUp”事件，然后检查有多少TextBox是非空的，将它与总文本框的数量进行比较，如果计数为非空匹配Total TextBoxes的数量，然后启用Commit按钮，否则禁用它。

使用的HTML有5个TextBox和1个名为Commit的Button。如果您在自己的网页中运行以下代码。 请记住包含JQuery 2.0

<span>TextBox #1</span><input type="text" /><br /><br />
<span>TextBox #2</span><input type="text" /><br /><br />
<span>TextBox #3</span><input type="text" /><br /><br />
<span>TextBox #4</span><input type="text" /><br /><br />
<span>TextBox #5</span><input type="text" /><br /><br />
<input id="btnSubmit" type="button" value="Commit" />

JQuery / JavaScript，它根据TextBoxes

中的文本启用和禁用Commit按钮

$(document).ready(function () {
    $("input[type=button]").attr("disabled", "disabled");

    //This routine attaches the "KEYUP" event to every TextBox
    //When the user types each TextBox will be checked every time
    //and count which ones are Not Empty, if the count of the Not Empty
    //TextBoxes equals that of the count of all TextBoxes then the
    //Commit button is Enabled. 
    $('input:text').keyup(function () {
        var isValid = true;
        $('input:text').each(function () {
            if ($(this).val().length === 0) {
                $("input[type=button]").attr("disabled", "disabled");
                isValid = false;
                return false;
            } 
            if (isValid) {
                $("input[type=button]").removeAttr("disabled");
            }
        });
    });

灰色按钮，直到所有文本框在ASP中都有文本

3 个答案: