我正在使用我的Worklight 6.1應用程序觀察一些奇怪的行爲。我有一個頁面(登錄頁面),沒有顯示任何jQuery樣式表效果。頁面確實拉起來,功能上沒問題,但它看起來不像我的其他頁面。Worklight 6.1 - jQuery樣式表不適用於我的某個頁面
這是奇怪的事情..當我看着Worklight設計器中的頁面時,我看到頁面使用jQuery樣式表呈現。但是,當我在預覽模式或設備上運行這個漂亮的按鈕圖標廣告標題(jQuery Mobile)已經消失。
下面是我在做什麼...
我有一個HTML文件中的應用程序有兩個DIV標籤,這是我的兩頁。我有一個適配器,它具有應用了安全測試的受保護過程。我創建了一個自定義登錄處理程序來使用自定義編碼的Java類來驗證我的應用程序。處理程序將首先檢查所請求的資源是否受到保護,如果是,將會(顯示/隱藏)正確的DIV。
應用程序試圖在init方法中調用受保護的資源,因此在啓動時應用程序首先會拋出登錄屏幕。這是我看到我的問題的地方。真奇怪的是,一旦我成功登錄,我就會被引導到另一個頁面,並且該頁面沒問題。這只是登錄頁面顯示不正確。
這是我在挑戰處理程序中的代碼。
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
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>MobileTAcT</title>
<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">
<script>window.$ = window.jQuery = WLJQ;</script>
<script src="jqueryMobile/jquery.mobile-1.3.1.js"></script>
</head>
<body id="content" style="display: none;">
<div data-role="page" id="addActivity">
<div data-role="header" id="header" data-position="fixed">
<h3>Add Activity</h3>
</div>
<div data-role="content" style="padding: 50px">
<div class="ui-grid-solo">
<div class="ui-block-a">
<label for="text">*Activity name:</label> <input type="text"
name="activtyName" id="activityName">
</div>
<div class="ui-block-a">
<label for="text">*Capabilities:</label><select name="capabil" id="capabil">
<option value="option">One</option>
<option value="option">TWO</option>
</select>
</div>
<div class="ui-block-a">
<label for="text">*Activity type:</label><select
name="activityType" id="activityType">
<option value="option">BLAH</option>
<option value="option">YO</option>
</select>
</div>
<div class="ui-block-a">
<label for="text0">MyNumber:<br>Leave field
blank
</label> <input type="text" name="sID" id="sID">
</div>
<div class="ui-block-a">
<label for="text">Customer name:</label><input type="text"
name="cName" id="cName">
</div>
</div>
<hr>
<div class="ui-grid-a">
<div class="ui-block-a">
<a href="#addActivity" data-role="button" id="submitBtn">Submit</a>
</div>
<div class="ui-block-b">
<a href="#mainMenu" data-role="button" id="button3">Cancel</a>
</div>
</div>
</div>
</div>
<div data-role="page" id="AuthBody">
<div data-role="header" id="header1" data-position="fixed">
<h3>Mobile TAcT</h3>
</div>
<div data-role="content" style="padding: 50px">
<div id="loginForm">
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" />
</div>
</div>
</div>
<script src="js/initOptions.js"></script>
<script src="js/MobileTAcT.js"></script>
<script src="js/messages.js"></script>
<script src="js/CustomAuthenticatorRealmChallengeHandler.js"></script>
</body>
</html>
這裏是什麼樣子的工作燈工作室。 (尼斯和漂亮)
這是我實際看到的,當我在模擬器或預覽模式下運行它。 (醜和滑動)
UPDATE
所以..我在Chrome加載這一點,看了看一個開發工具。我發現加載頁面時出現錯誤。奇怪..似乎以爲有沒有授權的錯誤
我不得不張貼評論部分的錯誤消息的鏈接,因爲我是一個新手,我只被允許發佈2個鏈接。我無法弄清楚爲什麼這個頁面在加載jQuery樣式表時遇到了問題。 (見註釋中的鏈接)
更新2
我已經發現了一些額外的細節,但我似乎仍不能算出這個。
我將默認頁面(實際上只是一個HTML文件中的DIV標籤)更改爲不同的頁面。我對此感到困惑,但顯然,應用了jQuery Stylesheet的ONLY頁面是DEFAULT頁面。所有其他頁面都可以正常工作,但jQuery樣式表不適用。爲什麼會這樣?我想不通爲什麼...
因此,請添加圖像的鏈接,而不是...? imgur,imageshack,一些服務... –
好主意....剛剛上傳的圖片鏈接! –
打開Chrome開發工具的控制檯,你看到了什麼錯誤? –