IBM Worklight 6.0.0.1 - JavaScript 未在 jQuery Mobile 多页应用程序中执行

Posted 2023-02-26

【中文标题】IBM Worklight 6.0.0.1 - JavaScript 未在 jQuery Mobile 多页应用程序中执行

【英文标题】：IBM Worklight 6.0.0.1 - JavaScript not executing in a jQuery Mobile multipage app

【发布时间】：2014-01-05 13:12:13

【问题描述】：

我正在使用 IBM Worklight Studio 版本_6.0.0.20130926-2018。

在我的应用程序中，我使用的是 jQuery Mobile 框架。 我的问题是，当我尝试使用$.mobile.changePage 加载data-role="page" 时，页面不会自行刷新。当我刷新此页面时，javascript 代码不起作用。

相反，我收到以下错误：

 ReferenceError: WLJQ is not defined profile.html:11
 TypeError: $ is undefined jquery.mobile-1.3.2.js:28
 ReferenceError: $ is not defined profile.js:3
 ReferenceError: WL is not defined

$.mobile.changePage 代码：

//redirect to profile
    function redirectToProfile(profileId)
        if(profileId == null || profileId == "")
            $("#failMessage").fadeIn();
        
        else
            var dataurl = '?profileID='+profileId;
            $("#failMessage").fadeOut(200, function()$("#loginSuccess").fadeIn(function()$.mobile.changePage('pages/profile.html'+dataurl, reloadPage : true,transition: "slide");););

        
    
); 

如何在 Worklight 中解决这个问题？

【问题讨论】：

删除 reloadPage 强制加载整个 HTML 标记。如果加载的页面没有在 head 标签中加载必要的库，它将无法工作。

【参考方案1】：

如果我理解正确，您创建了另一个您导航到的 HTML 页面。使用 Worklight 时，这不是正确的导航方式。 Worklight 是一个单页应用程序！因此您需要使用 div 元素来切换内容，而不是在页面之间导航。 可以在此处找到有关此的更多信息： http://public.dhe.ibm.com/software/mobile-solutions/worklight/docs/v610/03_02_Building_a_multi_page_application.pdf

【讨论】：

感谢您的回复。但问题是，如果我制作一个包含所有 div 的单个 html 文件，它可能会运行缓慢。此外，内容可能没有组织。我试图做的是：我有一个第一个 html 注册页面 - 由两个与用户登录和注册相关的数据角色页面和其他 html 个人资料页面以及与他的个人资料要求相关的其他数据角色页面组成。我认为这种方法比较容易管理。否则单个 html 文件中的所有注册和配置文件 div 可能会很混乱。

请看一下Worklight提供的多页示例应用项目：ibm.com/developerworks/mobile/worklight/…

好的！我试图理解 IBM 站点中提供的示例代码。

您还可以查看这个 pastebin，其中包含一个在 Worklight 中使用 jQuery Mobile 的非常基本的应用程序，带有页眉+内容+页脚和内容被其他 HTML 文件中的内容替换的按钮：@987654323 @ --- 此代码使用与 Shmulik 和我链接到的培训模块和示例中相同的页面加载方法。

$.mobile.changePage() 通过 Ajax 加载页面并将其放置在 body 或 pageContainer 中。我不知道 worklight 对此有何反应，但它与它有关，而不是 JQM。