Javascript jQuery不一致地调整div的大小-等高div

在我的页面上，我有6个div，分成两行，三行。我使用jQuery函数为它们指定一个高度，以便它们始终是具有最高内容的div的高度。当我加载页面时，有时可以，有时不行。大多数时候，它不会，而且div会比它们的内容短。有时当我点击刷新时，它们会延伸到最高的div的高度。我不确定是什么导致了这一点。该函数已在文档内部就绪

我应该注意，jQuery函数在我的本地文档上的工作方式是一致的，但在GitHub中不一致

以下是网站：

这些部门在“查看我的工作”下

以下是jquery：

$(document).ready(function() {
  // alert("document is ready!");
  applyHeight();
  $('.menu-toggle').click(function(e) {
    $('.menu').toggleClass('open');
    e.preventDefault();
  });
  $(window).on('resize', function() {
    applyHeight();
  });
}); // End document ready

// size samples to equal heights

// function to determine the tallest element
function equalHeight(block) {
  // Set tallest height to 0
  var tallest = 0;
  // Iterate over each block
  block.each(function() {
    // Creates variable and stores height for current element
    var thisHeight = $(this).height();
    // If current element's height is greater than 0 (or the tallest),      then it becomes the tallest
    if (thisHeight > tallest) {
      tallest = thisHeight;
    }
  });
   // Sets all block heights to the height of the tallest element
  block.height(tallest);
}

// function to apply equal heights
function applyHeight() {
  // If the sample is 300px wide run equal height function
  if ($(".sample").css("width") == "300px") {
    equalHeight($(".sample"));
    // If the sample is not 300px wide, set height to auto
  } else {
    $(".sample").css("height", "auto");
  }
}

编辑：

• $（window）.load（）-加载内容（包括图像）后激发

• 加载图像后，您可以计算高度

$（document）.ready（）

在加载DOM后立即激发，即使图像未加载。为此，您需要等待所有内容加载完毕<代码>$（窗口）.load（）执行以下操作：

$(window).load(applyHeight);

（为了简单起见，我将

applyHeight

函数作为参数传递。）

equalheight=函数（容器）{
var=0，
currentRowStart=0，
rowDivs=新数组（），
$el，
顶置=0；
$（容器）。每个（函数（）{
$el=$（此项）；
$（$el）.height（'auto'）
topPostion=$el.position（）.top；
if（currentRowStart！=topPostion）{
对于（currentDiv=0；currentDiv

$（窗口）.load（函数（）{applyHeight（）；}）；看起来好像成功了。是因为.load函数首先加载所有图像，而.ready函数在JS运行之前加载DOM而不是图像吗？另外，如果你把它作为一个答案，我会把它标记为正确的答案。这个答案非常需要一些解释。KirkRoybal amylynn83在评论问题中解释了它为什么会起作用，把它放在哪里…@KirkRoybal amylynn83

$(window).load(applyHeight);

equalheight = function(container){

var currentTallest = 0,
     currentRowStart = 0,
     rowDivs = new Array(),
     $el,
     topPosition = 0;
 $(container).each(function() {

   $el = $(this);
   $($el).height('auto')
   topPostion = $el.position().top;

   if (currentRowStart != topPostion) {
     for (currentDiv = 0 ; currentDiv < rowDivs.length ; currentDiv++) {
       rowDivs[currentDiv].height(currentTallest);
     }
     rowDivs.length = 0; // empty the array
     currentRowStart = topPostion;
     currentTallest = $el.height();
     rowDivs.push($el);
   } else {
     rowDivs.push($el);
     currentTallest = (currentTallest < $el.height()) ? ($el.height()) : (currentTallest);
  }
   for (currentDiv = 0 ; currentDiv < rowDivs.length ; currentDiv++) {
     rowDivs[currentDiv].height(currentTallest);
   }
 });
}

$(window).load(function() {
  equalheight('.main article');
});


$(window).resize(function(){
  equalheight('.main article');
});