Question

当我使用关于字段的jQuery的keyup事件时，我想要禁用所有字段，除非我正在访问的字段，如果我的字段为空，则必须启用所有表单字段。< / p>

这是html代码：

<form id="myform">
    <div class="form-group col-xs-4 col-md-4">
        <label for="customernumber" class="control-label">Customer Number</label>
        <input type="number" class="form-control" id="customer-number" />
    </div>
    <div class="form-group col-xs-5 col-md-5">
        <label for="surname" class="control-label">Surname</label>
        <input type="text" class="form-control" id="surname" />
    </div>
    <div class="form-group col-xs-2 col-md-2">
        <label for="datebirth" class="control-label">Date of Birth</label>
        <div class='input-group date' id="datetimepicker1">
            <input type='text' class="form-control" id="date-birth" />
            <span class="input-group-addon">
                <span class="glyphicon glyphicon-calendar"></span>
            </span>
        </div>                      
    </div>
</form>

这是js代码：

$("#customer-number").keyup(function() {
    $("#myform :input").prop("disabled", true);
})

怎么可能呢？

谢谢，

Answer 1

如果您想取消当前有焦点的input元素，您可以使用选择器$("#myform :input:not(:focus)")或$("#myform :input").not(this)。

此外，如果您还想根据当前input元素是否具有值来禁用其他字段，请根据当前元素值的长度设置disabled属性：

Example Here

$("#customer-number").on('input', function() {
    $("#myform :input:not(:focus)").prop("disabled", this.value.length);
});

我还将keyup事件更改为input事件，以便在值更改时触发事件，而不是在键启动时触发事件。

Answer 2

这是一种方式：

$("#customer-number").keyup(function() 
{
    $("#myform input").each(function()
    {
        $(this).prop("disabled", true);
    });
});

Each函数遍历#myform中的所有输入，而$(this)函数内的each指的是循环的当前元素。

Answer 3

喜欢这个你在寻找..？如果它是空的，则不应禁用。否则它应该......

＆＃13;

$("#myform :input").keyup(function() {
    $("#myform :input").each(function(){
      if($(this).val() !== ''){
      $(this).prop("disabled", true);
      }
      
    });
  $(this).prop("disabled",false);
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myform">
    <div class="form-group col-xs-4 col-md-4">
        <label for="customernumber" class="control-label">Customer Number</label>
        <input type="number" class="form-control" id="customer-number" />
    </div>
    <div class="form-group col-xs-5 col-md-5">
        <label for="surname" class="control-label">Surname</label>
        <input type="text" class="form-control" id="surname" />
    </div>
    <div class="form-group col-xs-2 col-md-2">
        <label for="datebirth" class="control-label">Date of Birth</label>
        <div class='input-group date' id="datetimepicker1">
            <input type='text' class="form-control" id="date-birth" />
            <span class="input-group-addon">
                <span class="glyphicon glyphicon-calendar"></span>
            </span>
        </div>                      
    </div>
</form>

＆＃13;

如何禁用除选定表单以外的所有表单字段

3 个答案: