$ .mobile.changepage(URL)使用PhoneGap获取“错误加载页面”

时间:2014-04-16 11:34:22

标签: javascript jquery jquery-mobile cordova

我正在处理我的第一个手机间隙应用程序,我在尝试导航到其他页面时遇到了一些麻烦。

在我的索引html上我有

        $.mobile.pageContainer.pagecontainer("change", "nextpage.html", { 
    reload: true, 
    transition: "slide"}
);

但是我一直收到错误加载页面消息,然后没有任何反应。

从网上浏览我可以认为这与nextpage.html没有找到有关,但我不明白为什么没有找到它。请注意我还尝试了/nextpage.html和./nextpage.html以及其他几个没有成功的

两个页面都在www文件夹的根目录

任何人都可以看到我出错的地方吗?

由于

修改 值得注意的是,此代码在firefox中运行

这里要求的是来自firebug的javascrtipt捕获

<!DOCTYPE html>
<!--
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements. See the NOTICE file
distributed with this work for additional information
regarding copyright ownership. The ASF licenses this file
to you under the Apache License, Version 2.0 (the
"License"); you may not use this file except in compliance
with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing,
software distributed under the License is distributed on an
"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, either express or implied. See the License for the
specific language governing permissions and limitations
under the License.
-->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.4.2.min.css" />
<title>Test App</title>
<script src="js/jquery-1.9.1.js"></script>
<script src="js/jquery-ui.js"></script>
<script src="js/jquery.mobile-1.4.2.min.js"></script>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
</head>
<body>
<div id="indexPage" data-role="page">
<div class="Login">
<h1>Network</h1>
<div id="LoginForm" class="blink LoginForm">
<img src="../logo.png" alt="Logo"
style="height:50%; text-align:center;" />
<p class="event listening">Connecting to Network</p>
<p class="event received">User name</p>
<input type="text" class="event Input" id="Username"/>
<br class="event received" />
<p class="event received">Password</p>
<input type="password" class="event Input" id="Password" />
<br />
<input type="button" title="Log in" value="Log in" class="event Submit" onclick="javascript:CallLogin()" />
<p class="error" id="Invalid">Invalid login details</p>
</div>
</div>
<script type="text/javascript">
$(document).bind("mobileinit", function () {
$.support.cors = true;
$.mobile.allowCrossDomainPages = true;
});
// app.initialize();
</script>
<script type="text/javascript">
function CallLogin() {
var CompanyID = "";
console.log('Start Function');
source:
{
console.log('Start Ajax Call');
$.support.cors = true;
$.ajax({
crossDomain: true,
url: "http://Webservice/WebMethod",
type: "POST",
dataType: "json",
contentType: "application/json; charset=utf-8",
data: "{ 'Username' : '" + document.getElementById('Username').value + "','Password' : '" + document.getElementById('Password').value + "'}",
dataFilter: function (data) { return data; },
success: function (data) {
if (data.d[1] == 'false') {
SetError('Invalid');
}
else {
CompanyID = data.d[0];
Set_localstorage('CompanyID', CompanyID);
console.log('CompanyID (success) = ' + get_localstorage('CompanyID'));
$.mobile.pageContainer.pagecontainer("change", "nextpage.html", { reload: true, transition: "slide"});
}
},
error: function (Error) {
console.log('CompanyID (fail) = ' + CompanyID);
console.log(Error.status);
console.log(Error.statusText);
console.log(Error.responseText);
}
});
}
console.log('End Ajax Call, CompanyID = ' + CompanyID);
}
</script>
</div>
</body>
</html> 

0 个答案:

没有答案