Question

真正的问题： 我有一个ul li.column，它自己排成一行并使用float:left css技巧自动换行到下一行。（我希望这个技巧很常见，你们大多数人都明白我在做什么？）

因为每个li实际上包含相等宽度的图像链接，所以我强迫li本身也具有相同的宽度，这样锚元素将包裹它的文本，以防它太长。 / p>

现在，不幸的是我有一个<li><a>LONG TEXT</a></li>被包裹，并且不可避免地增加了它的li容器的高度，然后它打破了下一行的CSS布局。

我想设置所有li.columns的高度来匹配此高度，但是想要使用jquery以编程方式进行。

所以这是我的部分代码：

var allColumns = $('li.column');
allColumns
.css('width','225px')
.css('padding-right','20px').css('background-color','transparent');
$('li.column:nth-child('+numCol+'n)').css('padding-right','0px');

var maxHeight = 0;
allColumns.each( function(index, item) {
  var height = $(item).height();
  if ( height > maxHeight ) { maxHeight = height; }
} );
allColumns.height(maxHeight);

我能做些什么来避免each循环使用更原生（优化）的东西来获取maxHeight？

Answer 1

不幸的是，这个问题的答案是没有神奇的答案。这真的是这样做的方式。

但是，现在您似乎正在定制<li>元素以适合您的内容大小。另一种方法是将您的内容与您的<li>元素相匹配（这可能取决于您的项目要求）您可以尝试这些css规则。以下所有规则都允许您操纵列处理较长文本的方式。如果你可以逃脱它，你就不需要做任何JQuery工作

white-space:nowrap;

overflow:scroll;或overflow:hidden;

Jquery优化最大高度确定

1 个答案: