Question

有人可以帮助解释为什么以下代码无效吗？我似乎无法弄清楚为什么......对我来说，一切都应该有效。

jQuery(window).load(function($){
    if (window.matchMedia("(min-width: 768px)").matches) { 
        var sideHeight = $('.mainContent').css('height');
        $('.sidebar').css('height', sideHeight);
    }
});

这是一个只有CSS部分的jsfiddle，它可以工作。 https://jsfiddle.net/24r9cax6/

我通过在该函数中发出警报来测试媒体匹配部分，我可以在window.load上弹出警报，但CSS代码不起作用。我从来没有能够在我的网站上运行CSS代码并使我的侧边栏与主要内容的高度相同。我将js放在头部和身体的末端。没有变化。

该网站是用WP构建的。内容是动态加载的，所以我认为它在内容加载之前就已经达到了高度，但这就是window.load（）应该修复的内容，对吧？

以下是您可以查看的网站上的文章。我希望侧边栏与mainContent div的高度相同，因此灰色背景继续向下移动。但仅限于平板电脑尺寸和使用（使用引导程序）。

http://www.businesstransitionandexitplanning.com/turning-business-income-into-retirement-income/

Answer 1

您无法将$传递给.load()，并将其视为将$传递给.ready()。你需要包装整个函数：

(function($){

    $(window).load(function(){
        if (window.matchMedia("(min-width: 768px)").matches) { 
            var sideHeight = $('.mainContent').css('height');
            $('.sidebar').css('height', sideHeight);
        }
    });

})(jQuery);

jQuery加载函数或matchMedia或.css（）函数不起作用

1 个答案: