Question

当每个框的值相同时，为什么button未被禁用。

我有4个文本框，2个用于比较部门名称的文本框和2个用于比较部门活动的文本框。

$("#departmentIDInput, #departmentNameInput, #departmentActive").bind("keyup change", function() {
  var departmentIDInput = $("#departmentIDInput").val();
  var departmentNameInput = $("#departmentNameInput").val();
  var departmentNameInputCurrent = $("#departmentNameInputCurrent").val();
  var departmentActive = $("#departmentActive").val();
  var departmentActiveVal = $("#departmentActiveVal").val();
  var departmentActiveValCurrent = $("#departmentActiveValCurrent").val();

  if (departmentNameInput != departmentNameInputCurrent) {
    $("#btnUpdate").attr('disabled', false).removeClass('btn_inact').addClass('btn_act');
  } else {
    $("#btnUpdate").attr('disabled', true).removeClass('btn_act').addClass('btn_inact');
  }

  if (departmentActiveVal == departmentActiveValCurrent) {
    $("#btnUpdate").attr('disabled', false).removeClass('btn_inact').addClass('btn_act');
  } else {
    $("#btnUpdate").attr('disabled', true).removeClass('btn_act').addClass('btn_inact');
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="departmentNameInput" name="departmentNameInput" maxlength="30" value="Production"/>
<input type="text" id="departmentNameInputCurrent" name="departmentNameInputCurrent" maxlength="30" value="Production"/>

<input type="text" name="departmentActiveVal" class="departmentActiveVal" id="departmentActiveVal" value="Y"/>
<input type="text" name="departmentActiveValCurrent" class="departmentActiveValCurrent" id="departmentActiveValCurrent" value="Y"/>

<input type="checkbox" class="departmentActive" id="departmentActive" />

<input type="button" class="button turquoise" id="btnUpdate" value="Update" disabled/>

如果选中复选框，则单击或取消选中该按钮
当输入“departmentNameInput”时，例如：Productions（On departmentNameInputCurrent is：Production），按钮工作正常，意味着禁用。但是当我尝试再次删除与“departmentNameInputCurrent”相同的文本时，该按钮不会被禁用。

有人有想法吗？

Answer 1

由于您的第二个if条件，每个框的值相同时，按钮不会被禁用。

 if (departmentActiveVal == departmentActiveValCurrent) {
    $("#btnUpdate").attr('disabled', false).removeClass('btn_inact').addClass('btn_act');
  }

此计算结果为true，按钮将启用

Answer 2

您可以尝试在三元操作中简化您的功能，例如：

$("#departmentIDInput, #departmentNameInput, #departmentActive").bind("keyup change", function() {
  var departmentIDInput = $("#departmentIDInput").val();
  var departmentNameInput = $("#departmentNameInput").val();
  var departmentNameInputCurrent = $("#departmentNameInputCurrent").val();
  var departmentActive = $("#departmentActive").val();
  var departmentActiveVal = $("#departmentActiveVal").val();
  var departmentActiveValCurrent = $("#departmentActiveValCurrent").val();
  var isNameEqual = departmentNameInput === departmentNameInputCurrent;
  var isActiveValueEqual = departmentActiveVal === departmentActiveValCurrent;
  var isDisabled = isNameEqual && isActiveValueEqual;

  $("#btnUpdate").prop('disabled', isDisabled).removeClass('btn_inact').addClass('btn_act');
});

jQuery如果条件根据条件不能正常工作

2 个答案: