Cordova - window.history.back() 在 iOS 9 中的 HTML 后退按钮上不起作用
Cordova - window.history.back() not working on HTML back button in iOS 9
在我的应用程序中,我使用 window.history.back 导航回上一个视图
后退按钮声明
<div class="back_icon" id="verification_back_icon"><a href="#" data-rel="back" data-transition="slidedown"><img src="images/back_btn.png" width="23"/></a></div>
按钮操作:
$( "#verification_back_icon" ).on( "click", function ( e ) {
if ( checkDirtyVacation() ) {
e.preventDefault();
if ( backbtnAlt == false ) {
backbtnAlt = true;
confirm( "All data will be lost. Do you want to continue?",
function ( r ) {
if ( r ) {
//onBackKeyDown();
clearVacationvalues();
window.history.back();//this is not working in iOS 9
} else {
}
backbtnAlt = false;
} );
}
}
else {
e.preventDefault();
if ( $( ".vaction_location" ).hasClass( "chkSelect" ) ) {
$( ".vaction_location" ).removeClass( "chkSelect" );
$( ".vaction_location" ).addClass( "chkUnSelect" );
}
window.history.back();
}
} );
这在 iOS 8.4 之前一直有效。在 iOS 9 中,此导航不起作用。
我正在使用 Apache Cordova native platform version 3.8.0
.
如果有人遇到类似问题,请给我建议。
我试过 history.back doesn't work on iOS using Cordova,但没有成功
谢谢。
试试这个
if(r){
try{
var nav = window.navigator;
if( this.phonegapNavigationEnabled && nav && nav.app && nav.app.backHistory )
{
nav.app.backHistory();
}
else
{
window.history.back();
}
}
catch(e)
{
alert(e);
}
}
@Sujania,
根据 phonegap 团队的说法,iOS9 未得到官方支持。这个问题可能是 iOS9 中的另一个错误。您可能需要等待修复。
PhoneGap 版本 iOS 9 支持状态
http://community.phonegap.com/nitobi/topics/phonegap-build-ios-9-support-status
Top line: iOS 9 is not officially supported until Cordova-iOS 4.0.0, which the Cordova team is hard at work on. However some issues can be solved with some simple configuration changes.
此时,Cordova 错误存储库报告了 4 个错误。您的问题未出现在存储库中 - 截至此日期。
https://issues.apache.org/jira/browse/CB-9684?jql=text%20~%20%22iOS9%22
问题是 window.location.hash
的设置在 iOS 9.0 UIWebview(由 Cordova/Phonegap 使用)中是异步的 - 有关详细信息,请参阅 this bug report。
这会导致使用 jQuery 移动设备时出现问题,默认情况下使用 window.location.hash
在 "pages" 之间导航。它还会导致使用此机制的 popups/dialogs/select 菜单出现问题。
您可以通过阻止 jQuery Mobile 自动 listening/using location.hash:
来解决此问题
$(document).on("deviceready", function(){
$.mobile.hashListeningEnabled = false;
});
但是,我发现这对 Android 有副作用,例如导致硬件后退按钮不起作用,所以我专门针对 iOS 9 使用 cordova-plugin-device:
$(document).on("deviceready", function(){
if(device.platform === "iOS" && parseInt(device.version) === 9){
$.mobile.hashListeningEnabled = false;
}
});
请注意,我将 navigator.app.backHistory()
而不是 window.history.back()
与 hashListeningEnabled = false
结合使用 - 这可能会有所不同。
或者您可以使用 this plugin to use the new WKWebView on iOS 8 and 9. WKWebView is used by Safari on iOS 8+, hence JQM sites viewed in the browser on iOS 9 don't encounter these issues. cordova-ios 3 still uses UIWebView due to a bug in WKWebView in iOS 8, but the upcoming cordova-ios 4 will support a WKWebView core plugin 来获得 iOS 9+。请注意,由于其更严格的安全性,将 WKWebView 与 Cordova/Phonegap 应用程序一起使用时还有其他注意事项,例如在 XHR 响应中需要 CORS headers。
解决方案:
这一行解决了我的问题:
history.go(0);
我已将 window.history.back()
替换为 history.go(0);
现在它在 iOS 9
对我来说工作正常
在index.html
<script type="text/javascript">$.mobile.hashListeningEnabled = false;</script>
在 onDeviceReady 函数中添加:
function onDeviceReady() {
if ( device.platform === "iOS" && parseInt( device.version ) === 9 ) {
$.mobile.hashListeningEnabled = false;
}
if ( !( $.mobile.hashListeningEnabled &&
$.mobile.path.isHashValid( location.hash ) &&
( $( hashPage ).is( ":jqmData(role='page')" ) ||
$.mobile.path.isPath( hash ) ||
hash === $.mobile.dialogHashKey ) ) ) {
// make sure to set initial popstate state if it exists
// so that navigation back to the initial page works properly
if ( $.event.special.navigate.isPushStateEnabled() ) {
$.mobile.navigate.navigator.squash( path.parseLocation().href );
}
$.mobile.changePage( $.mobile.firstPage, {
transition: "none",
reverse: true,
changeHash: false,
fromHashChange: true
} );
} else {
// trigger hashchange or navigate to squash and record the correct
// history entry for an initial hash path
if ( !$.event.special.navigate.isPushStateEnabled() ) {
$window.trigger( "hashchange", [true] );
} else {
// TODO figure out how to simplify this interaction with the initial history entry
// at the bottom js/navigate/navigate.js
$.mobile.navigate.history.stack = [];
$.mobile.navigate( $.mobile.path.isPath( location.hash ) ? location.hash : location.href );
}
}
}
验证设备 OS 版本(因为 history.go(0)
仅适用于 iOS 9)在 iOS 9 版本 window.history.back()
之前完美运行
现在添加这段代码代替 window.history.back()
if ( device.platform === "iOS" && parseInt( device.version ) === 9 ) {
console.log( "version" + device.version );
console.log( "iOS 9" );
history.go( 0 );
//write your code here
}
else {
window.history.back();
}
要在控制台中修复此消息 "Failed to load webpage with error: CDVWebViewDelegate: Navigation started when state=1",请在 CDVWebViewDelegate.m
中添加以下代码
In - (BOOL)webView:(UIWebView*)webView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType
方法注释如下所示这段代码:
/*if ([_delegate respondsToSelector:@selector(webView:didFailLoadWithError:)]) {
NSDictionary* errorDictionary = @{NSLocalizedDescriptionKey : description};
NSError* error = [[NSError alloc] initWithDomain:@"CDVWebViewDelegate" code:1 userInfo:errorDictionary];
[_delegate webView:webView didFailLoadWithError:error];
}*/
禁用推送状态对我有用:
$.mobile.pushStateEnabled = false;
我认为是A标签的默认操作导致了这个错误。所以我只是通过在点击处理函数
末尾添加 return false
来阻止默认操作
而且有效。
- html
<a id="back-btn">back</a>
javascript
$('#back-btn').on('click', function(e) {
window.history.go(-1);
return false;
})
在我的应用程序中,我使用 window.history.back 导航回上一个视图
后退按钮声明
<div class="back_icon" id="verification_back_icon"><a href="#" data-rel="back" data-transition="slidedown"><img src="images/back_btn.png" width="23"/></a></div>
按钮操作:
$( "#verification_back_icon" ).on( "click", function ( e ) {
if ( checkDirtyVacation() ) {
e.preventDefault();
if ( backbtnAlt == false ) {
backbtnAlt = true;
confirm( "All data will be lost. Do you want to continue?",
function ( r ) {
if ( r ) {
//onBackKeyDown();
clearVacationvalues();
window.history.back();//this is not working in iOS 9
} else {
}
backbtnAlt = false;
} );
}
}
else {
e.preventDefault();
if ( $( ".vaction_location" ).hasClass( "chkSelect" ) ) {
$( ".vaction_location" ).removeClass( "chkSelect" );
$( ".vaction_location" ).addClass( "chkUnSelect" );
}
window.history.back();
}
} );
这在 iOS 8.4 之前一直有效。在 iOS 9 中,此导航不起作用。
我正在使用 Apache Cordova native platform version 3.8.0
.
如果有人遇到类似问题,请给我建议。 我试过 history.back doesn't work on iOS using Cordova,但没有成功
谢谢。
试试这个
if(r){
try{
var nav = window.navigator;
if( this.phonegapNavigationEnabled && nav && nav.app && nav.app.backHistory )
{
nav.app.backHistory();
}
else
{
window.history.back();
}
}
catch(e)
{
alert(e);
}
}
@Sujania,
根据 phonegap 团队的说法,iOS9 未得到官方支持。这个问题可能是 iOS9 中的另一个错误。您可能需要等待修复。
PhoneGap 版本 iOS 9 支持状态
http://community.phonegap.com/nitobi/topics/phonegap-build-ios-9-support-status
Top line: iOS 9 is not officially supported until Cordova-iOS 4.0.0, which the Cordova team is hard at work on. However some issues can be solved with some simple configuration changes.
此时,Cordova 错误存储库报告了 4 个错误。您的问题未出现在存储库中 - 截至此日期。
https://issues.apache.org/jira/browse/CB-9684?jql=text%20~%20%22iOS9%22
问题是 window.location.hash
的设置在 iOS 9.0 UIWebview(由 Cordova/Phonegap 使用)中是异步的 - 有关详细信息,请参阅 this bug report。
这会导致使用 jQuery 移动设备时出现问题,默认情况下使用 window.location.hash
在 "pages" 之间导航。它还会导致使用此机制的 popups/dialogs/select 菜单出现问题。
您可以通过阻止 jQuery Mobile 自动 listening/using location.hash:
来解决此问题$(document).on("deviceready", function(){
$.mobile.hashListeningEnabled = false;
});
但是,我发现这对 Android 有副作用,例如导致硬件后退按钮不起作用,所以我专门针对 iOS 9 使用 cordova-plugin-device:
$(document).on("deviceready", function(){
if(device.platform === "iOS" && parseInt(device.version) === 9){
$.mobile.hashListeningEnabled = false;
}
});
请注意,我将 navigator.app.backHistory()
而不是 window.history.back()
与 hashListeningEnabled = false
结合使用 - 这可能会有所不同。
或者您可以使用 this plugin to use the new WKWebView on iOS 8 and 9. WKWebView is used by Safari on iOS 8+, hence JQM sites viewed in the browser on iOS 9 don't encounter these issues. cordova-ios 3 still uses UIWebView due to a bug in WKWebView in iOS 8, but the upcoming cordova-ios 4 will support a WKWebView core plugin 来获得 iOS 9+。请注意,由于其更严格的安全性,将 WKWebView 与 Cordova/Phonegap 应用程序一起使用时还有其他注意事项,例如在 XHR 响应中需要 CORS headers。
解决方案:
这一行解决了我的问题:
history.go(0);
我已将 window.history.back()
替换为 history.go(0);
现在它在 iOS 9
对我来说工作正常在index.html
<script type="text/javascript">$.mobile.hashListeningEnabled = false;</script>
在 onDeviceReady 函数中添加:
function onDeviceReady() {
if ( device.platform === "iOS" && parseInt( device.version ) === 9 ) {
$.mobile.hashListeningEnabled = false;
}
if ( !( $.mobile.hashListeningEnabled &&
$.mobile.path.isHashValid( location.hash ) &&
( $( hashPage ).is( ":jqmData(role='page')" ) ||
$.mobile.path.isPath( hash ) ||
hash === $.mobile.dialogHashKey ) ) ) {
// make sure to set initial popstate state if it exists
// so that navigation back to the initial page works properly
if ( $.event.special.navigate.isPushStateEnabled() ) {
$.mobile.navigate.navigator.squash( path.parseLocation().href );
}
$.mobile.changePage( $.mobile.firstPage, {
transition: "none",
reverse: true,
changeHash: false,
fromHashChange: true
} );
} else {
// trigger hashchange or navigate to squash and record the correct
// history entry for an initial hash path
if ( !$.event.special.navigate.isPushStateEnabled() ) {
$window.trigger( "hashchange", [true] );
} else {
// TODO figure out how to simplify this interaction with the initial history entry
// at the bottom js/navigate/navigate.js
$.mobile.navigate.history.stack = [];
$.mobile.navigate( $.mobile.path.isPath( location.hash ) ? location.hash : location.href );
}
}
}
验证设备 OS 版本(因为 history.go(0)
仅适用于 iOS 9)在 iOS 9 版本 window.history.back()
之前完美运行
现在添加这段代码代替 window.history.back()
if ( device.platform === "iOS" && parseInt( device.version ) === 9 ) {
console.log( "version" + device.version );
console.log( "iOS 9" );
history.go( 0 );
//write your code here
}
else {
window.history.back();
}
要在控制台中修复此消息 "Failed to load webpage with error: CDVWebViewDelegate: Navigation started when state=1",请在 CDVWebViewDelegate.m
中添加以下代码In - (BOOL)webView:(UIWebView*)webView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType
方法注释如下所示这段代码:
/*if ([_delegate respondsToSelector:@selector(webView:didFailLoadWithError:)]) {
NSDictionary* errorDictionary = @{NSLocalizedDescriptionKey : description};
NSError* error = [[NSError alloc] initWithDomain:@"CDVWebViewDelegate" code:1 userInfo:errorDictionary];
[_delegate webView:webView didFailLoadWithError:error];
}*/
禁用推送状态对我有用:
$.mobile.pushStateEnabled = false;
我认为是A标签的默认操作导致了这个错误。所以我只是通过在点击处理函数
末尾添加return false
来阻止默认操作
而且有效。
- html
<a id="back-btn">back</a>
javascript
$('#back-btn').on('click', function(e) { window.history.go(-1); return false; })