vinoth babu
Necesito obtener solo el elemento show () en jquery foreach loop
En el siguiente código, obtengo todo el elemento con prueba de clase (es decir) tanto oculto como mostrado… pero solo necesito mostrar y no ocultar uno… ¿cómo filtrar y obtener eso en esta línea en sí?
$('.element').find('.test').each(function(index, loopelement) {
}
Utilizar el :visible selector:
$('.element').find('.test:visible').each(function(index, loopelement) {
// do stuff...
});
-
@RoryMcCrossan, pero la pregunta era “… tanto oculta como mostrada…”. Quiero decir, no estoy discutiendo sobre los documentos. Los he leído y es por eso que hago este comentario ya que esta solución “no es exactamente la respuesta a la pregunta”
– Sr. P
28 de septiembre de 2015 a las 7:17
-
@Pisek No estoy seguro de lo que quieres decir. El OP dice que actualmente está obteniendo todos los elementos (tanto ocultos como mostrados) y quiere cambiar ese comportamiento para que el selector solo devuelva los elementos que se muestran, que es exactamente lo que hace mi respuesta.
–Rory McCrossan
5 de febrero de 2016 a las 9:59
-
@RoryMcCrossan, el título de este número es
Get only the elements which are not hidden.. Jquery. Y en jQuery docs para :visible:Elements with visibility: hidden or opacity: 0 are considered visible, since they still consume space in the layout.. Entonces, como dije antes: Tu respuesta no es correcta… Seleccionarás elementos que son visible o oculto. sólo omitirás pantalla: ninguno elementos.– Sr. P
8 de febrero de 2016 a las 9:08
-
@RoryMcCrossan, lo siento pero no;) Tu respuesta es simplemente incorrecta. De nuevo, la pregunta era …pero solo necesita mostrarse y no ocultarse…. ¡Tu código no funcionará para elementos ocultos! No se trata de semántica: lo oculto está oculto, lo que no se muestra no se muestra. Sé estricto con eso. Su código solo funcionará para los elementos que no se muestran. Amigo, te acabo de mostrar el error que cometiste. Si quieres arreglarlo, hazlo como quieras. Solo vine aquí para encontrar la respuesta a una pregunta, y lo siento, pero la respuesta es incorrecta.
– Sr. P
8 de febrero de 2016 a las 9:34
Bruno
Puedes usar jQuery: visible selector.
var $visibles = $(".element").find(".test:visible");
Pero tenga en cuenta cómo funciona jQuery. De la documentación de jQuery:
Los elementos se consideran visibles si ocupan espacio en el documento. Los elementos visibles tienen un ancho o alto mayor que cero.
Los elementos con visibilidad: oculta u opacidad: 0 se consideran visibles, ya que aún consumen espacio en el diseño.
En caso de que este comportamiento no se ajuste a su caso de uso, podría extender jQuery, creando su propio selector personalizado:
$.expr[":"].reallyVisible =
function reallyVisible (elem) {
if (elem == null || elem.tagName == null) {
return false;
}
if (elem.tagName.toLowerCase() === "script" || elem.tagName.toLowerCase() === "input" && elem.type === "hidden") {
return false;
}
do {
if (!isVisible(elem)) {
return false;
}
elem = elem.parentNode;
} while (elem != null && elem.tagName.toLowerCase() !== "html");
return true;
};
function isVisible (elem) {
var style = elem.style;
// Depending on your use case
// you could check the height/width, or if it's in the viewport...
return !(style.display === "none" || style.opacity === "0" || style.visibility === "hidden");
}
Se puede utilizar como cualquier otro selector integrado:
$(".element").find(".test:reallyVisible");
$(".element").find(".test:first").is(":reallyVisible");
Realmente vale la pena la hora (o dos, máximo) que se necesita para leer el Documentación de la API de jQuery principio a fin. Encontrarás todo tipo de cosas que no sabías (incluido el
:visibleseleccionador Rory’s señalado).–TJ Crowder
19 de diciembre de 2012 a las 10:01