Question

我有这个问题，我想使用

过滤选择的元素（例如表单的控件）

$controls = $(document).find('.control');
$controls.filter('[required]:visible');

这应该会返回表单的控件是可见的和必需的。

问题在于我隐藏了一组元素，但元素是可见的，例如：

<div class="group" style="display:none">
    <div class="control" id="control1" required>
         <input type="text" />
    </div>
    <div class="control" id="control2" required>
         <input type="text" />
    </div>
...
    <div class="control" id="control3">
         <input type="text" />
    </div>
</div>

当我过滤控件时，我没有得到任何东西，因为“组”隐藏了所有。

我该如何解决？（我知道如何，但问题是关于'[required]:visible'的简单性，我希望得到这样的答案，使用选择器）。

感谢。

Answer 1

您可以将此代码段用于您的操作：

＆＃13;

$controls = $(document).find('.control');
console.log($controls.filter(function(){
	return $(this).css('display') == 'block' && $(this).attr('required') == 'required';
}));

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="group" style="display:none">
    <div class="control" id="control1" required>
         <input type="text" />
    </div>
    <div class="control" id="control2" required>
         <input type="text" />
    </div>
    <div class="control" id="control3">
         <input type="text" />
    </div>
</div>

＆＃13;

Answer 2

为什么不隐藏元素而不是隐藏组？或者如果您对隐藏元素的值感兴趣，只需删除ObjectB过滤器。

Answer 3

如果你可以分享一个工作小提琴甚至一个片段，我可以帮助你更好。但我仍然尽力回答你的问题。

首先，由于您的父母被隐藏，您的孩子也将被隐藏（正常行为）

其次，试试这个

var elem = $(element),
controlElem = elem.find(".control"),
if(controlElem.hasClass("required")){
success code goes here.

也不要忘记将选择器更改为（'[required = required]'）

希望这有帮助。

如何过滤被另一个元素隐藏的“可见”jQuery元素？

3 个答案: