2016-09-12 42 views
0

我想配置一个JavaScript函数来在特定的网页上重新加载排序。该网站有一个全面的JS和CSS框架,但我只是希望这个特定的函数加载有点不同。配置一个特定的JavaScript函数重新加载页面

JS框架中的JS函数动态设置网格元素的高度。例如,如果我有三个高度分别为155px,34px和100px的元素,它将使用具有最高值的元素,并将该高度应用于所有网格元素,使其全部为155px。

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

这个特定页面的不同之处在于它编码的应用程序。该页面中有一个过滤应用程序,其中包含一个搜索文本框和一个类似于亚马逊的应用程序过滤器的复选框,用于男士或女士服装等类别。但是,与亚马逊不同,检查/取消选中复选框或在搜索框中输入其他内容只需加载/重新加载“内容”,但页面实际上不会重新加载,内容仅仅是链接。链接从单独的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); 

我真的不上传了一大堆的代码,因为我试图理解如何在概念上解决这个问题(前提是我在我对这个问题的解释中清楚)。

为了迭代我的目标,我想要加载这个特定网页中的网格项目,即使在单击/键入通过过滤器应用程序之后也是相同的高度。

请让我知道,如果我可以澄清其他任何事情。

回答

0

此答案已解决。我所做的(有用的)是取这段代码:$(".grid > .grid-item").matchHeight();,并将其放置在特定网页使用的JavaScript文件中。这段代码是动态设置元素高度的。

相关问题