Tengo una tabla con celdas de texto de longitud variable. Quiero encontrar la altura de la celda más alta y luego hacer que todas las celdas tengan esa altura. ¿Cómo puedo hacer esto?¿Cómo puedo encontrar la altura más grande de la celda de la tabla con jQuery?
De esta manera:
var max = 0;
$('table td').each(function() {
max = Math.max($(this).height(), max);
}).height(max);
En la llanura Inglés, bucle a través de todas las células y encontrar el valor máximo, y luego aplicar ese valor a todas las células.
Hay several plugins que pueden hacer esto por usted. Sin embargo, el código se vería así:
var tallest = 0;
$('table td').each(function() {
if (tallest < $(this).height()) {
tallest = $(this).height();
}
});
$('table td').css({'height': tallest});
Puede usar jQuery con el siguiente código
var maxHeight = 0;
$('#yourTableID td').each(function(index, value)
{
if ($(value).height() > maxHeight)
maxHeight = $(value.height());
}).each(function(index, value) {
$(value).height() = maxHeight;
});
creo que sirve
Espera, ¿qué está pasando aquí: '$ (valor) .height() = maxHeight'. El colocador requiere 'maxHeight' como un argumento de función, mientras que ningún argumento devolverá la altura. ¿Y por qué no usarías 'this' después de todo? – Harmen
sólo para ser diferente:
var heights = $('td').map(function() {
return $(this).height();
}).get();
var maxHeight = Math.max.apply(Math, heights);
$('td').css('height', maxHeight);
¿Realmente necesita guardar la altura de todas las celdas de la tabla en una matriz? Esto significa que en realidad tiene que escanear sobre ellos tres veces. La primera vez para obtener todas las alturas, una segunda iteración para obtener la altura máxima y la tercera vez para establecer la altura máxima. – Harmen
La recolección de basura se encarga de la matriz al final. ¿No crees que comparar cada altura requiere algo de potencia de CPU? Math.max.apply() es extremadamente eficiente. Lamento haber publicado algo diferente de la norma. Si lo comparas, gana. Prefiero el ejemplo de Tatu personalmente, la gente entiende el encadenamiento. –
Puedes estar ahí, ya no puedo deshacer mi voto negativo, la próxima vez solo añadiré un comentario antes de presionar el botón de votar hacia abajo – Harmen
contribuir el ejemplo de @tatu ulmanen
Esto es obvio, pero si sólo quiere estirar las filas con celdas más altas envolver un bucle tr :)
$('table tr').each(function(){
var max = 0;
$(this).find('td').each(function(){
max = Math.max($(this).height(), max);
}).height(max);
});
+1 porque es corto, pero se puede optimizarlo. Puede eliminar 'max === false ||' por ejemplo. Y creo que deberías mover '$ (this) .height()' a una variable, lo que te ahorra un par de llamadas a funciones dobles – Harmen
Espera, ya lo arreglaste. Esa es una solución realmente buena. Creo que – Harmen
@Harmen, gracias, ahora usa 'Math.max()' que lo simplifica bastante. –