当隐藏元素显示在屏幕上时重新运行功能

Question

• 我有一个功能可以检查我的所有表单字段是否都已填写 在，如果他们有它删除我提交的禁用属性 按钮并允许用户提交。

• 这很好用，但是，我有一个字段，只有在 在页面上的下拉列表之一中选择了某些元素， 当这个元素出现时，我像这样添加验证类：

  if (job.value === "OTHER") {
      $('#inputOtherJobFunction').parent().show();
      $('#inputOtherJobFunction').addClass('validate');
  } else {
      $('#inputOtherJobFunction').removeClass('validate);
  }
  

然后我在我的函数中再次分配 $fieldsToCheck 变量，因此它现在包含屏幕上的新表单元素。

当这个新元素出现在屏幕上后，只有当我点击另一个输入框并输入内容时，禁用的按钮才会变为活动状态。

我认为每次在我的表单上输入任何内容时都需要触发此功能，但我不太确定。

let $registerButton = $('.create-account-button');
let $fieldsToCheck = $('.registration-form .validate');

let checkFields = function () {
    $fieldsToCheck = $('.registration-form .validate');
    console.log('being called');
    let emptyFields = $fieldsToCheck.map(function () {
        return this.value;
    }).get().filter(function (val) {
        return val.length === 0;
    });
    $registerButton.prop('disabled', !!emptyFields.length);
};

$fieldsToCheck.blur(checkFields);
checkFields();

Answer 1

试过了吗？

if (job.value === "OTHER") {
            $('#inputOtherJobFunction').parent().show();
            $('#inputOtherJobFunction').addClass('validate');

            checkFields();
        } else {
            $('#inputOtherJobFunction').removeClass('validate);
        }

编辑： 通过您的评论了解您的需求我会说尝试将该方法附加到相关事件。

$fieldsToCheck.on('focus blur change', checkFields);

您的案例可能只需要focus 和blur