Question

我有一个由多个可选子部分组成的表单 - 每个部分都包含在

中

<div class="details"></div>

在编辑表单时，我想隐藏那些尚未完成的子部分，显然我想不引人注意地进行。为了简化操作，我只是检查名称以'surname'结尾的那些字段是否为空，然后适当地显示/隐藏。到目前为止，我有这个。

//hide the all of the element class details
$(".details").each(function (i) {
  if ($('input[name$=surname]:empty',this).length == 1) { 
    $(this).hide();
  } else {
    $(this).show();
  }
});

当然，：empty选择器可能是错误的，或者确实不合适。（当然我真正想做的是展示任何领域已经完成的任何部分，但我认为我会从检查最重要的部分开始。）

如果有人能指出我正确的方向，我会很高兴......

Answer 1

没有选择爱吗？不完全确定它是你真正想要的，但是它隐藏了所有细节元素，里面有一个空输入。也许这是一个线索。

<div class="details">
    <input type="text" name="surname" />
</div>

<script type="text/javascript">
    $(".details input[@value='']").parents(".details").hide();
</script>

Answer 2

谢谢你们 - [value =“”]是我失踪的那篇文章。如果有其他人想知道，那些完成伎俩的准分子jQuery（感谢cristian）是

    //hide the all of the element class details
    $(".details").each(function (i) {
      if ($('input[name$=surname][value=""]',this).length == 1) { 
        $(this).hide();
        console.log('hiding');
      } else {
        $(this).show();
        console.log('showing');
      }
    });

Answer 3

这可能只是一个错字，但你也不需要/不应该在你的标记中有一个CSS类名“.details”，只是“细节”。点前缀是CSS / jQuery选择器语法的一部分。

根据documentation，“：empty”查找空元素（如不包含子元素），而不是没有值的表单元素（空文本框）。检查等于空字符串的value属性将适用于单行文本输入，但是您需要更复杂的查询来包含文本区域，单选按钮等。

Answer 4

这可能会做出请求的事情：

$("div.details input").each(function () {
  if (this.value == "")
    $(this).parents("div.details").eq(1).hide();
  else
    $(this).parents("div.details").eq(1).show();
});

要仅影响name属性中带有“surname”的字段，请执行以下操作：

$("div.details input[name$=surname]").each(function () { /* etc... */

如何根据其中的空输入字段隐藏div？

4 个答案: