Javascript Can'；t使就绪和调整大小功能一起工作

我有两个容器并排放置（浮动）。这两个容器都会自动生成多个表单，我不知道哪一个是最高的

因此，我使用一个简单的

脚本

来计算这两个

div

高度，并将最高值应用于两者。足够简单且工作良好：

$(document).ready(function () {
    var height = Math.max($(".left").outerHeight(),$(".right").outerHeight());
    $(".left").height(height);
    $(".right").height(height);
});

里面的表单是响应性的，因此它将根据窗口宽度显示在3、2或1列中。简单易用

css

：

.form {
    float:left;
    width:50%;
    padding-right:20px;
}
@media (max-width: 800px) {
  .form {
    width:100%;
    } 
}

我的问题是，在加载页面时，我似乎无法使脚本同时在resize和at ready功能下工作，并且在用户手动调整窗口大小时运行脚本

到目前为止，我已经尝试了我在这里找到的解决方案，但是没有一个有效，我也不知道为什么。我试过：

$(document).ready(function() {
    $(window).resize(function() {
         var height = Math.max($(".left").outerHeight(), $(".right").outerHeight());
            $(".left").height(height);
            $(".right").height(height);
    }).resize();        

});

及

及

但是，在重新加载窗口时仍然可以工作，但在容器增长（低于800px）时调整大小不会运行脚本（或者高度值不会更改）

我不是javascript/jquery方面的专家，所以我可能缺少一些基本的东西，但几个小时后我找不到任何解决方案

---

下面是一个带有原始

脚本的示例。任何小小的帮助都将受到热烈的感谢
 处理调整大小的方法是正确的，问题是您之前已经设置了两个
div
的
高度，因此它们不再扩展/收缩到其内容的大小。即，如果加载时
div
s的
height
设置为286，则调整窗口大小时
Math.max
计算将使用286

要修复此问题，请在计算哪个更大之前重置高度：


$（窗口）。调整大小（函数（）{
$（“.left，.right”）.height（'auto'）；
var height=Math.max（$（“.left”）.outerHeight（），$（“.right”）.outerHeight（））；
$（“.left，.right”）。高度（height）；
}).resize（）
*{
框大小：边框框；
}
身体{
保证金：0；
}
.左{
浮动：左；
宽度：50%；
右边填充：20px；
背景颜色：灰色；
边框：1px实心；
}
.对{
浮动：左；
宽度：50%；
背景颜色：灰色；
}
.表格{
浮动：左；
宽度：50%；
右边填充：20px；
}
输入{
宽度：100%；
}
@介质（最大宽度：800px）{
.表格{
浮动：左；
宽度：100%；
右边填充：20px；
}
}

形式

形式

形式

形式

形式

形式

我希望在将脚本大小调整为与页面加载时相同的大小时。检查两个div的高度，并将最高值应用于两个div。基本上，当窗口小于800px，并且div内的窗体改变位置时，两个div的高度都会增加很多。这正是我需要的。非常感谢，没问题，很高兴我能帮忙。
$(document).ready(myfunction);
$(window).on('resize',myfunction);

function myfunction() {
    var height = Math.max($(".left").outerHeight(),$(".right").outerHeight());
    $(".left").height(height);
    $(".right").height(height);
}

var callback = function () {
  var height = Math.max($(".left").outerHeight(),$(".right").outerHeight());
    $(".left").height(height);
    $(".right").height(height);
};

$(document).ready(callback);
$(window).resize(callback);