Question

Zurb Foundation 6.5.3

我有一个手风琴菜单，在初始页面加载后需要通过ajax更新。因此，最初菜单包含2个项目，然后调用$(document).foundation();。稍后，在收到ajax响应后，会在菜单内添加（并可能删除/替换）元素。

我希望能够重复使用相同的元素，但是，我无法更新插件来重新设置已更改元素的样式。我尝试过：

$("#my-menu").foundation();无效，并显示错误：

试图在已经有Foundation插件的元素上初始化手风琴菜单。
Foundation.reflow(menu, 'accordion');无效。
menu.foundation('reflow');无效，并显示错误：

未捕获的ReferenceError：很抱歉，“回流”不是AccordionMenu可用的方法。

我通过销毁并删除现有菜单，重新创建整个内容，然后调用$("#my-menu").foundation();使其工作，但这在我看来并不理想。

Answer 1

我发现我的问题是由于在所有3种情况下都没有一种解决方案有效

基金会尚未初始化
基金会已初始化，自此以来整个元素已被替换
成立以来，基础已经更新，

除非有人有更好的答案，否则我将使用以下方法解决：

// this can happen before, or after code creates the menu
$(document).foundation();
console.log("foundation run");
__foundationRun = true;


...


function foundationUpdate(el) {
    if (__foundationRun) {
        if (el.data('zfPlugin'))
            // already initialised, update it
            Foundation.reInit(el);
        else
            // new element, initialise it
            el.foundation();
    }
    // else leave for foundation initialise
}

....

// ... do updates (modify or replace entirely) and then:
foundationUpdate($("#my-menu"));

更新已具有插件的元素

1 个答案: