Zurb基金会JavaScript reInit模块不工作

问题描述：

我是ajaxifying一个网站。我的菜单应该一直很粘（使用Foundation提供的粘性模块）。但它只是对常规页面加载粘性，而不是对Ajax重新加载（在网站上导航时也是如此）
我试图在事件ajaxComplete发生时使用基金会文档中提供的行重新初始化模块6：Zurb基金会JavaScript reInit模块不工作

$(document).ajaxComplete(function() { 
    Foundation.reInit($('.sticky')); 
    //other code 
});

但它似乎没有工作，因为我在控制台收到此错误：

TypeError: Cannot read property '_init' of undefined 
    at HTMLElement.<anonymous> (foundation.core.js:103) 
    at Function.each (jquery.min.js?ver=2.1.0:2) 
    at o.fn.init.each (jquery.min.js?ver=2.1.0:2) 
    at Object.reInit (foundation.core.js:102) 
    at HTMLDocument.<anonymous> (stickyfooter.js:28) 
    at HTMLDocument.dispatch (jquery.min.js?ver=2.1.0:3) 
    at HTMLDocument.r.handle (jquery.min.js?ver=2.1.0:3) 
    at Object.trigger (jquery.min.js?ver=2.1.0:3) 
    at x (jquery.min.js?ver=2.1.0:4) 
    at XMLHttpRequest.<anonymous> (jquery.min.js?ver=2.1.0:4)

，我不明白。这是什么意思？如何在ajax重新加载后使模块工作？网站在行动：http://lesdeuxvagues.com/demo

答

好的元素，所以它显然是在zurb基金会一个已知的问题，粘模块不工作后，被破坏（尽管我不知道为什么它会在我的情况下被销毁，因为我只是用AJAX重新载入其他内容），但所有其他基础js插件似乎都在工作。（请参阅：https://github.com/zurb/foundation-sites/issues/9047）
我将尝试的解决方案是找到另一个粘性库来处理此特定问题。

答

您没有发布您的标记，但我访问了该网站，并没有在您的CSS中看到“.sticky”类。你在一个jQuery选择调用

Foundation.reInit()

。那么

$('.sticky')

选择您的网页上的任何东西？你为什么不尝试：

 Foundation.reInit($('[data-sticky]'))

这将重新初始化所有的属性数据粘性

标头也有id＃masthead这个类有粘性！我应用这行'$（'。sticky'）.css（'border'，'2px solid red'）;''在'ajaxComplete'里面，它显示一个红色边框！对不起没有发布标记，它很长，所以我不知道哪个部分是相关的！我尝试了数据粘性，并得到像以前一样的错误TypeError：无法读取未定义的属性'_init' –

当我从您的URL加载页面时，标题是粘性的（除非在小屏幕上...您需要添加。 'stickyOn：small' 到数据选项，直到你点击一个按钮，它保持粘性 - 当错误出现这可是那么你导航到一个新的页面，所以你需要调用 '$ （document）.foundation（）' 代替'reInit（）' – genestd

哦，感谢'stickyOn：small'，我的意思是解决这个问题呢！奇怪的是，我添加试图调用'$（document）。基础（）'，但它也行不通，我甚至没有在控制台中发生错误，所以我不知道它出错的地方。，也许是因为我的元素在'ajaxComplete'之前已经是'data-sticky'属性了，它不会再被初始化了吗？（因此'reInit（）'尝试），但显然我错了某处！ –

Zurb基金会JavaScript reInit模块不工作

相关推荐