div元素中的.each(),找到一个子元素,根据其内容设置高度(高级?)

我需要找到div的每一行,并根据获得最多内容的h2来确定该行中h2s的高度。

我正试图循环通过一个div(主要)共同组织div(孩子),在那个div我得到了部分(孩子),在那个部分我得到了一个h2。

现在基于h2中获得最多内容的内容,我使用jQuery库设置其他h2的高度: http : //www.tomdeater.com/jquery/equalize_columns/

我知道一些jQuery,但不是那么多,我可以弄清楚如何做到这一点。

最好是检查jsfiddle链接http://jsfiddle.net/CbNRH/13/ 。 我还没有完成脚本。 首先,我试图找到h2元素并写出它的值。 然后我想我会继续前进,但这比我对jQuery的知识更复杂。 任何帮助表示赞赏。

depending on my content i use .equalizeCols()

2

depending on my content i use .equalizeCols()

3

depending on my content i use .equalizeCols()

6

$('#col-main > div').each(function () { var $this = $(this); $('#write-out').text($this.child('section').find('h2').val()); }); div.contain { margin-bottom: 10px; background-color: #dddddd; } div.contain section { padding: 10px; } div.contain section div h2 { font-size: 12px; width: 80px; background-color: red; } div#write-out { font-size: 16px; padding: 10px; background-color: #ffcc00; }

我拿了k.honsali代码并简化了一下,所以我的建议如下:

 $('#col-main > div').each(function () { var tmpHeight = 0; $(this).find("h2").each(function() { tmpHeight = $(this).height() > tmpHeight ? $(this).height() : tmpHeight; }); $(this).find("h2").height(tmpHeight); }); 

达累斯萨拉姆,

你必须循环两次:第一次找到最高数字H2,第二次调整其他H2s的高度。 我们开始做吧:

 var maxval = 0; var maxheight = 0; $('#col-main > div').each(function () { tmp = $(this).children().find('h2').val(); if(tmp > maxval ) { maxval = tmp; maxheight = $(this).children().find('h2').css('height'); } }); $('#col-main > div').each(function () { $(this).children().find('h2').css('height', maxheight); }); 

不过,我想知道上面是否可以优化。

看看http://jsfiddle.net/CbNRH/39/ ,我认为这是没有.equalizeCols()处理这个问题的最佳方法


看看http://jsfiddle.net/CbNRH/38/ ,我认为这是用.equalizeCols()处理这个问题的最佳方法