多选择器等高脚本适配问题：需独立处理各组高度匹配

你只需要修改脚本，让它支持按选择器分组单独计算等高，而不是把所有选择器的元素混在一起处理。修改后的代码如下：

var matchHeight = function () {
    // 定义需要单独处理的选择器组，每个选择器对应一组元素
    var selectorGroups = ['#services h3', '#services .info'];

    function init() {
        eventListeners();
        matchHeights();
    }

    function eventListeners(){
        $(window).on('resize', function() {
            matchHeights();
        });
    }

    function matchHeights(){
        // 遍历每个选择器组，单独计算每组的最大高度
        selectorGroups.forEach(function(selector) {
            var groupElements = $(selector);
            var groupHeights = [];

            // 先重置最小高度，确保计算准确
            groupElements.css('min-height', 'auto');

            // 收集当前组所有元素的高度
            groupElements.each(function() {
                groupHeights.push($(this).outerHeight());
            });

            // 找到组内最大高度，应用到当前组所有元素
            var maxHeight = Math.max.apply(null, groupHeights);
            groupElements.css('min-height', maxHeight);
        });
    };

    return {
        init: init
    };

} ();

$(document).ready(function() {
    matchHeight.init();
});

修改说明 #

1. 新增selectorGroups数组：把需要独立计算等高的选择器都放进这个数组，比如你需要的#services h3和#services .info
2. 遍历处理每组选择器：原来的脚本是把所有选择器的元素合并成一个集合计算最大高度，现在改成遍历每个选择器组，对每组单独执行「重置高度→收集高度→设置最大高度」的逻辑
3. 避免变量重名：把原来的matchHeight函数改名为matchHeights，防止和外层的matchHeight变量冲突

这样修改后，#services h3会统一使用该组内的最大高度，#services .info也会使用自身组内的最大高度，不会再出现所有元素被设置成同一个高度的问题。

内容的提问来源于stack exchange，提问作者joshmrodg