配置特定的JavaScript函数以在页面上重新加载

Question

我正在尝试配置一个JavaScript函数，以便在特定的网页上进行某种“重新加载”。该网站有一个总体的JS和CSS框架，但我只是希望这个特定的功能加载有点不同。

JS框架中的JS函数动态地设置网格元素的高度。例如，如果我有三个高度为155 to、34 to和100 to的元素，则它接受具有最高值的元素，并将该高度应用于所有网格元素，使它们全部为155 to。

对于站点中的其余页面，代码很好，因为JS脚本在页面加载时执行。但是，我使用函数的页面似乎没有遵守JS脚本。当它应该有相同的高度时，它仍然保持不同的高度。

这个特定页面的不同之处在于它中编码的应用程序。页面中有一个过滤应用程序，其中包含一个搜索文本框和一个复选框，类似于Amazon的应用程序筛选器，用于男装或女装等类别。但是，与Amazon不同的是，在搜索框中选中/取消复选框或键入其他内容只是加载/重新加载“内容”，但是页面实际上并没有重新加载，内容只是链接。链接是从一个单独的XML文件中加载的。

本例中的链接是网格元素。它们被设置成像交互式按钮。

以下是JS函数的代码：

(function ($, window, document, undefined ) {

'use strict';

// add initialisation
this.addInitalisation('equal-heights', function() {

    this.debug('Module: Equal Heights');

    var font = new FontFaceObserver('BentonSansRegular');

   font.load().then(function () {
      // console.log('Font is available');
      $(".grid > .grid-item").matchHeight();
    });
});

// Register UI module
this.UIModule({
    module: 'equal-heights',
    init: function() {
        this.initialize('equal-heights');
    }
}); 
})( jQuery, window, window.document );

我并没有真正上传大量的代码，因为我想了解如何从概念上解决这个问题(前提是我对这个问题的解释是清楚的)。

为了迭代我的目标，我希望将这个特定网页中的网格项加载到相同的高度，即使在单击/键入过滤器应用程序之后也是如此。

如果我还能澄清什么，请告诉我。

Answer 1

这个答案已经解决了。我所做的(起作用的)是获取这段代码：$(".grid > .grid-item").matchHeight();，并将其放入特定网页使用的JavaScript文件中。这段代码是动态设置元素高度的内容。