关于移动设备：Worklight 6.1 – jQuery 样式表未应用于我的页面之一

Worklight 6.1 – jQuery Stylesheet doesn’t get applied for one of my pages

我发现我的 Worklight 6.1 应用程序出现了一些奇怪的行为。我有一个页面(登录页面)，它没有显示任何 jQuery 样式表效果。该页面确实拉起并且功能上很好，但它看起来不像我的其他页面。

这是奇怪的事情。当我在 Worklight 设计器中查看页面时，我看到页面是使用 jQuery 样式表呈现的。但是，当我在预览模式或设备上运行它时，漂亮的按钮图标广告标题(jQuery Mobile)消失了。

这就是我正在做的…

我有一个带有两个 DIV 标签的 HTML 文件的应用程序，这是我的两个页面。我有一个适配器，它有一个应用了安全测试的受保护过程。我创建了一个自定义登录处理程序来使用自定义编码的 Java 类对我的应用程序进行身份验证。处理程序将首先检查请求的资源是否受到保护，如果是，它将(显示/隐藏)正确的 DIV。

应用程序尝试在 init 方法中调用受保护的资源，因此在启动时应用程序首先会弹出登录屏幕。这就是我看到我的问题的地方。真正奇怪的是，一旦我成功登录，我会被定向到另一个页面，并且该页面很好。只是登录页面显示不正确。

这是我在挑战处理程序中的代码。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

customAuthenticatorRealmChallengeHandler.handleChallenge = function(response){
var authStatus = response.responseJSON.authStatus;

if (authStatus =="required"){
$(‘#addActivity’).hide();
$(‘#AuthBody’).show();
$(‘#passwordInputField’).val(”);
if (response.responseJSON.errorMessage){
alert(response.responseJSON.errorMessage);
}
} else if (authStatus =="complete"){
$(‘#AuthBody’).hide();
$(‘#addActivity’).show();
customAuthenticatorRealmChallengeHandler.submitSuccess();
}
};

这是我的 HTML

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
MobileTAcT
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
<link rel="shortcut icon" href="images/favicon.png">
<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
<link href="jqueryMobile/jquery.mobile-1.3.1.css" rel="stylesheet">
<link href="jqueryMobile/jquery.mobile.theme-1.3.1.css" rel="stylesheet">
<link href="jqueryMobile/jquery.mobile.structure-1.3.1.css" rel="stylesheet">
<link rel="stylesheet" href="css/MobileTAcT.css">
window.$ = window.jQuery = WLJQ;
<script src="jqueryMobile/jquery.mobile-1.3.1.js">
</head>
<body id="content" style="display: none;">

Add Activity

<label for="text">*Activity name:</label> <input type="text"
name="activtyName" id="activityName">

<label for="text">*Capabilities:</label><select name="capabil" id="capabil">

<option value="option">One</option>
<option value="option">TWO</option>
</select>

<label for="text">*Activity type:</label><select
name="activityType" id="activityType">
<option value="option">BLAH</option>
<option value="option">YO</option>

</select>

<label for="text0">MyNumber:Leave field
blank
</label> <input type="text" name="sID" id="sID">

<label for="text">Customer name:</label><input type="text"
name="cName" id="cName">

Submit

Cancel

Mobile TAcT

Username:<br/>
<input type="text" id="usernameInputField" /><br />
Password:<br/>
<input type="password" id="passwordInputField" /><br/>
<input type="button" id="loginButton" value="Login" />
<input type="button" id="cancelButton" value="Cancel" />

这是 Worklight Studio 中的样子。 (漂亮又漂亮)

关于移动设备：Worklight 6.1 – jQuery 样式表未应用于我的页面之一

现在我的应用程序按预期工作了..

这是解决方案..

在我的应用程序中，我最初尝试更改页面(只是更改以在同一 HTML 中显示不同的 DIV)，如下所示，但它没有使用 JQuery 样式表呈现页面。

1 2	$(‘#NewPage’).show(); $(‘#CurrentPage’).hide();

我发现，如果我用这个替换我上面的代码，它就会按预期工作。我现在可以从当前页面转换到新页面，并且我页面中的所有元素现在都使用 JQuery 样式表

呈现

1	$.mobile.changePage(‘#NewPage’);

关于移动设备：Worklight 6.1 – jQuery 样式表未应用于我的页面之一

Worklight 6.1 – jQuery Stylesheet doesn’t get applied for one of my pages

相关推荐

发表回复