英特尔 AppFramework - sidemenu 不工作

Question

我在使用英特尔 AppFramework 时遇到问题。我似乎无法使用副菜单。

它在您可以从 AppFramework 网站下载的演示中运行良好，但无论我如何模仿它，我都无法在我的项目中使用侧边菜单。

一切正常，直到我添加标签，因为这就是您制作侧边菜单的方式。添加这些标签后，整个应用程序将呈现空白/白色，并且控制台中会弹出一条错误消息 "Uncaught TypeError: Cannot read property 'hideScrollbars' of undefined".

它与 appframework.ui.js' 第 1100 行 this.scrollingDivs.menu_scroller.hideScrollbars();

有关

所以看起来这个 menu_scroller 由于某种原因未定义。

这是我能给你的所有代码，它是我的 AppFramework / Phonegap 应用程序的 index.html：http://pastebin.com/dXtTeiKx

控制台不会说任何丢失的文件（cordova.js 除外，这很好，因为 PC）也不会抛出任何其他 JavaScript 错误，而不是我告诉你的错误，所以我假设我不需要 post 每个其他文件中的代码。

我已经尝试使用 AppFramework 3.0 版的标签。

我也试过稍微切换 JavaScript 包含，包括 appframework.ui 在 appframework 之前，并将一些包含放在 index.html 的底部，但是 none如果到目前为止这些已经解决了问题。

我也尝试删除所有多余的 css 和 js 包含，但这也不起作用。

这让我相信 AppFramework 本身存在某种错误，或者我只是做了一些非常错误的事情或者我监督了一些事情。

这是 AppFrameworks sidemenu 的文档：http://app-framework-software.intel.com/documentation.php#afui/afui_side 如您所见，除了将导航内容添加到源代码之外，它不需要任何其他内容，我什至尝试复制整个

<nav id="leftMenu" class="view"> <header><h1>Left Menu</h1></header> <div class="pages"> <div class="panel active"> This is the left menu </div> </div> </nav>

...但这并没有改变什么。

Answer 1

所以我自己成功解决了这个问题。我不知道 AppFramework 在后台做了什么样的魔法，但导致导航对我不起作用的问题是我有一个这样定义的面板：

<div data-title="Main menu" id="menu" class="panel" data-footer = "main_footer" data-header = "main_header" data-nav = "main_leftmenu">
    This is the main menu
</div>

导航的正确定义如下：

<nav class = "view" id = "main_leftmenu">
    <ul class = "list">
        <li><a href = "#">asd</a></li>
        <li><a href = "#">asd</a></li>
        <li><a href = "#">asd</a></li>
    </ul>
</nav>

就像我说的，问题出在面板上；如您所见，它的 ID 为 "menu" - 这就是破坏导航的原因。 "Menu" 作为面板的 id 很可能是一个保留的词或其他东西，因此不应使用它。

我建议如果您使用 AppFramework，您应该在所有内容（尤其是面板）前加上类似这样的前缀：

<div data-title="Main menu" id="f_main_menu" class="panel" data-footer = "main_footer" data-header = "main_header" data-nav = "main_leftmenu">
    This is the main menu
</div>

在这里，我在 "main" 面板前面加上了 "f_" 前缀（还有“_main”，但那只是额外的，所以它更多地讲述了面板）。

简而言之

为您的面板 ID 添加前缀，不要给它们任何一个 ID "main" 或 "menu"。请改用 "x_main" 和 "x_menu" 之类的内容。

英特尔 AppFramework - sidemenu 不工作

Intel AppFramework - sidemenu not working

javascript

jquery

html

web-applications

appframework