判断一个表单有哪些有name属性的元素被display隐藏
时间: 2023-08-08 07:07:16 浏览: 53
可以使用以下代码来判断一个表单内有哪些有name属性的元素被`display:none`隐藏:
```javascript
const form = document.querySelector('form');
const hiddenElements = [];
form.querySelectorAll('[name]').forEach(element => {
const style = window.getComputedStyle(element);
if (style.display === 'none') {
hiddenElements.push(element);
}
});
console.log(hiddenElements);
```
首先,通过`querySelector`方法获取表单元素,然后使用`querySelectorAll`方法获取所有带有`name`属性的元素。接着,使用`getComputedStyle`方法获取元素的计算样式,并判断`display`属性是否为`none`,如果是的话,将元素添加到`hiddenElements`数组中。最后,打印出`hiddenElements`数组,里面包含了所有被`display:none`隐藏的带有`name`属性的元素。
相关问题
获取表单内的全部没有被隐藏的name属性值部分元素其父容器会通过display=none隐藏
您可以使用JavaScript来获取表单内的全部没有被隐藏的name属性值部分元素。首先,您需要遍历表单中的所有元素,然后判断它们的父容器是否被隐藏。如果元素的父容器没有被隐藏并且它具有name属性,则将其添加到一个数组中。下面是一个示例代码:
```javascript
// 获取表单中的所有元素
const formElements = document.forms[0].elements;
const visibleElements = [];
// 遍历表单中的所有元素
for (let i = 0; i < formElements.length; i++) {
const element = formElements[i];
// 判断元素的父容器是否被隐藏
if (element.offsetParent !== null) {
// 判断元素是否具有name属性
if (element.hasAttribute('name')) {
// 将元素添加到数组中
visibleElements.push(element.getAttribute('name'));
}
}
}
console.log(visibleElements);
```
在上面的代码中,我们首先使用`document.forms[0].elements`获取表单中的所有元素。然后,我们遍历这些元素,并使用`element.offsetParent`来判断它们的父容器是否被隐藏。如果元素的父容器没有被隐藏并且它具有name属性,则将其添加到一个数组中。最后,我们使用`console.log`输出这个数组。
jquery获取表单内父容器没有被display=none隐藏的表单name属性值部
你可以使用以下 jQuery 代码来获取表单内父容器没有被 display=none 隐藏的表单 name 属性值部分:
```javascript
$('form').find(':input').not(':hidden, [disabled], [aria-hidden="true"], [type="submit"], [type="button"]').filter(function() {
return $(this).parents().filter(function() {
return $(this).css('display') === 'none';
}).length === 0;
}).each(function() {
console.log($(this).attr('name'));
});
```
这段代码会遍历整个表单内所有的 input 元素,使用 `not` 过滤掉隐藏的表单元素,然后使用 `filter` 找到它们所在的父容器是否被隐藏,最后使用 `each` 循环输出每个元素的 name 属性值。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)