虽然表单字段为空 jquery 或 js

Question

我需要检查一个页面，当页面上的前 3 个表单字段全部为空时，该页面将显示一条消息。我可以编写检查并显示消息，但我不确定在 js/jquery 中处理“while”部分的正确方法是什么。我可以将其放入每 100 毫秒运行一次的循环中，但我 100% 确信它绝对错误。

var empty = true;    
$('input[type="text"].slice(0,3)').each(function() {
   if ($(this).val() != "") {
      empty = false;
      return false;
   }
});

if (empty) {
  document.getElementById('interactive-warning').style.display = 'none';
};

这样做的“正确”方法是什么？

---

工作代码：

$(document).ready(function(){
  $('.form-text').slice(0,3).on('input', function() {
    var empty = true;    
    $('.form-text').slice(0,3).each(function() {
      if ($(this).val() != "") {
        empty = false;
        return false;
      }
    });

    if (!empty) {
      document.getElementById('interactive-warning').style.display = 'none';
    } else {
      document.getElementById('interactive-warning').style.display = 'block';
    };
  }).trigger('input');
});

我需要在准备好的时候执行，因为代码需要在表单之前添加。

Answer 1

您可以收听input 事件，它会在用户 更改这些值时通知您，例如：

将现有代码移动到function checkIfEmpty() { ... 并添加：

$('input[type="text"].slice(0,3)').on("input", checkIfEmpty);

（注意在事件中 checkIfEmpty 后没有()）

如果您的输入是通过代码更改的，则不会引发 UI 事件，因此您需要一个替代方案。最简单的方法是：当您的代码更改输入时，也调用checkIfEmpty()。