Question

我想知道我是否可以选择div作为孩子的input字段。

以下是我使用的HTML：

<div class="xxx">
    <div class="panel panel-success">
      <div class="panel-heading">
        <h3 class="panel-title">my title</h3>
      </div>
      <div class="panel-body">
        <div class="row">
            <div class="col-md-5">some content</div>
            <div class="col.md-7">some content</div>
        </div>
        <div class="row">
            <div class="col-md-5">some content</div>
            <div class="col-md-3">
                <input type="text" class="form-control" id="date" />
            </div>
        </div>
      </div>
    </div>
</div>

Bootstrap为所有div块添加填充和边距（如果它们具有col- *类）。我想要实现的是，如果div包含input字段，则边距和填充应设置为0px。

所以主要问题是：＆＃34;我可以根据他的内容选择一个div吗？＆＃34;

我尝试了div[class*="..."]和div[class^="..."]，但两者都没有解决我的问题。

Answer 1

尝试使用:has()选择器，

$('div:has(:input)')

或者你可以使用，

$(':input').filter(function(){
  return $(this).parent('div').length;
}).parent();

Answer 2

您可以选择其他策略。您可以向这些div添加一个类，并使用css规则来应用零填充和边距。

<div class="col-md-3 zero-padding-margin">
            <input type="text" class="form-control" id="date" />
        </div>

并且

  .zero-padding-margin {
margin: 0;
padding: 0;
}

我可以选择包含输入字段的div吗？

2 个答案: