Jquery 如何将类添加到内部有空输入的所有表单组中？_Jquery

Jquery 如何将类添加到内部有空输入的所有表单组中？

jquery

Jquery 如何将类添加到内部有空输入的所有表单组中？,jquery,Jquery,通过单击“我的”按钮“变粉红色”，我想突出显示内部没有任何文本的输入字段： $highlight.clickfunction{ $'.form group input'.Blur函数{ 如果！$this.val{ $this.parents'.form group'.addClass'has-error'； } }; }; .有错误{ 背景颜色：粉红色 } 输入输入我不确定，但我想你必须这样检查 $(this).attr('value') === '' 按“表单组”选择，而不是仅选择其

通过单击“我的”按钮“变粉红色”，我想突出显示内部没有任何文本的输入字段：

$highlight.clickfunction{ $'.form group input'.Blur函数{ 如果！$this.val{ $this.parents'.form group'.addClass'has-error'； } }; }; .有错误{ 背景颜色：粉红色 } 输入输入

我不确定，但我想你必须这样检查

$(this).attr('value') === ''

按“表单组”选择，而不是仅选择其父级

<!DOCTYPE html>
    <html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <style>
    .has-error {
      background-color: pink
    }
    </style>
    <script>
    $(document).ready(function(){
      $('.form-group input').blur(function() {
      if (!$(this).val()) {
        $('.form-group').addClass('has-error');
      }
    });
    });
    </script>
    </head>
    <body>

    <div class="form-group">
      <label>Input</label>
      <input type="text" id="input">
    </div>

    <div class="form-group">
      <label>Input</label>
      <input type="text" id="input" value="Some Text">
    </div>
    </body>
    </html>

这可能对你有帮助

$('.form-group input').blur(function() {
      var value = $(this).val();
      if (value == "" || value == undefined) {
          $(this).parents('.form-group').addClass('has-error');
      }
 });

据我所知，您希望输入在单击按钮后立即变为粉红色。但是，在单击事件中嵌套了一个模糊事件。这意味着，一旦单击按钮，它就会将模糊事件绑定到输入，并等待发生。因此，如果您单击按钮，然后单击其中一个输入并单击“离开”，它将变为粉红色

要使其在单击时立即发生，请消除该模糊事件并将其更改为类似以下内容，即使用jQuery的each函数：

$("#highlight").click(function () {
  $('.form-group input').each(function() {
   if (!$(this).val()) {
     $(this).parents('.form-group').addClass('has-error');
   }
  });
});

一旦您专注于输入，您的代码就会按预期工作。那么您预期的行为是什么呢？？？代码正在运行…。@A.Wolff抱歉，我完全忘了添加我的按钮。因此，我希望通过单击我的按钮，只突出显示没有文本的输入。否，值永远不会是未定义的。这与OP的代码完全相同，顺便说一句，它的工作原理与预期的一样抱歉，我忘了在我的问题中添加，我需要通过点击按钮来突出显示。所以我现在更新了我的问题