


Clicking the browser's back button will refresh the history page. Solution to this problem
First of all, we know how this problem occurs. If we have the following page list information page, click to enter the details page, modify the data on the details page and return it through history, and then return to the list information page, because the list information is a history return Yes, the original data before modification is still displayed by default, and the modified data needs to be refreshed. So, is there any way for us to refresh the data in the previous history page by clicking the return button on the mobile phone?
onpageshow event and onload event. The onpageshow event is similar to the onload event. The onload event is triggered when the page is loaded for the first time. The onpageshow event is triggered every time the page is loaded. That is, the onload event is not triggered when the page is read from the browser cache.
To see whether the page was loaded directly from the server or read from the cache, you can use the persisted attribute of the PageTransitionEvent object to determine. If the page reads this attribute from the browser's cache, it returns true, otherwise it returns false
Solution
By onload method
The code is as follows:
Write a hidden input in the page
<input type="hidden" id="refreshed" value="no">
js operation is as follows
onload=function(){ var refreshedId=document.getElementById("refreshed"); if(refreshedId.value=="no"){ refreshedId.value="yes"; } else{ refreshedId.value="no"; location.reload(); } }
Through onpageshow method
This method is no problem on the computer, but it does not return in Apple Safari To execute the onload event, use the following method:
window.onpageshow = function(event) { if (event.persisted) { window.location.reload() } };
Through actual operation, we found that event.persisted always returns false on the computer, but there is no problem on the mobile phone safari.
Comprehensive solution
Therefore, you can write the code as follows:
if ((/iphone|ipod|ipad.*os 5/gi).test(navigator.appVersion)) { window.onpageshow = function(event) { if (event.persisted) { window.location.reload() } }; }else{ onload=function(){ var refreshedId=document.getElementById("refreshed"); if(refreshedId.value=="no"){ refreshedId.value="yes"; } else{ refreshedId.value="no"; location.reload(); } } }
Through the above code, I found that when the page is opened for the first time in Safari, sometimes a splash screen will appear. Effect.
Add the following code:
$(window).bind("unload", function() { });
The splash screen effect will no longer appear.
Prevent caching through iframe
Add the following code to the page
<iframe style="height:0px;width:0px;visibility:hidden" src="about:blank"> this prevents back forward cache </iframe>
This method needs to be verified.
By TimestampForced refresh method
The following code is for the safari return button problem in iPad
var showLoadingBoxSetIntervalVar; var showLoadingBoxCount = 0; var showLoadingBoxLoadedTimestamp = 0 function showLoadingBox(text) { var showLoadingBoxSetIntervalVar=self.setInterval(function(){showLoadingBoxIpadRelaod()},1000); showLoadingBoxCount = 0 showLoadingBoxLoadedTimestamp = new Date().getTime(); //Here load the spinner } function showLoadingBoxIpadRelaod() { //计算时间超过500毫秒 var diffTime = ( (new Date().getTime()) - showLoadingBoxLoadedTimestamp - 500)/1000; showLoadingBoxCount = showLoadingBoxCount + 1; var isiPad = navigator.userAgent.match(/iPad/i) != null; if(diffTime > showLoadingBoxCount && isiPad){ location.reload(); } }
I believe you have mastered it after reading these cases Method, for more exciting information, please pay attention to other related articles on the php Chinese website!
Related reading:
css3 click to display ripple effects
How to use canvas to create the effect of particle fountain animation
The above is the detailed content of Clicking the browser's back button will refresh the history page. Solution to this problem. For more information, please follow other related articles on the PHP Chinese website!

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

AI Hentai Generator
Generate AI Hentai for free.

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics

Coinbase Security Login Guide: How to Avoid Phishing Sites and Scams? Phishing and scams are becoming increasingly rampant, and it is crucial to securely access the Coinbase official login portal. This article provides practical guides to help users securely find and use the latest official login portal of Coinbase to protect the security of digital assets. We will cover how to identify phishing sites, and how to log in securely through official websites, mobile apps or trusted third-party platforms, and provide suggestions for enhancing account security, such as using a strong password and enabling two-factor verification. To avoid asset losses due to incorrect login, be sure to read this article carefully!

As the world's leading digital asset trading platform, Ouyi OKX attracts many investors with its rich trading products, strong security guarantees and convenient user experience. However, the risks of network security are becoming increasingly severe, and how to safely register the official Ouyi OKX account is crucial. This article will provide the latest registration portal for Ouyi OKX official website, and explain in detail the steps and precautions for safe registration, including how to identify the official website, set a strong password, enable two-factor verification, etc., to help you start your digital asset investment journey safely and conveniently. Please note that there are risks in digital asset investment, please make cautious decisions.

This article provides a detailed guide to safe download of Ouyi OKX App in China. Due to restrictions on domestic app stores, users are advised to download the App through the official website of Ouyi OKX, or use the QR code provided by the official website to scan and download. During the download process, be sure to verify the official website address, check the application permissions, perform a security scan after installation, and enable two-factor verification. During use, please abide by local laws and regulations, use a safe network environment, protect account security, be vigilant against fraud, and invest rationally. This article is for reference only and does not constitute investment advice. Digital asset transactions are at your own risk.

This article details how to register an account on the official website of Ouyi OKX Exchange and start cryptocurrency trading. As the world's leading cryptocurrency exchange, Ouyi provides a wide range of trading varieties, multiple trading methods and strong security guarantees, and supports convenient withdrawal of a variety of fiat and cryptocurrencies. The article covers the search methods for Ouyi official website registration entrance, detailed registration steps (including email/mobile registration, information filling, verification code verification, etc.), as well as precautions after registration (KYC certification, security settings, etc.), and answers common questions to help novice users quickly and safely complete Ouyi account registration and start a cryptocurrency investment journey.

This article provides a safe and reliable Binance Exchange App download guide to help users solve the problem of downloading Binance App in the country. Due to restrictions on domestic application stores, the article recommends priority to downloading APK installation packages from Binance official website, and introduces three methods: official website download, third-party application store download, and friends sharing. At the same time, it emphasizes security precautions during the download process, such as verifying the official website address, checking application permissions, scanning with security software, etc. In addition, the article also reminds users to understand local laws and regulations, pay attention to network security, protect personal information, beware of fraud, rational investment, and secure transactions. At the end of the article, the article once again emphasized that downloading and using Binance App must comply with local laws and regulations, and at your own risk, and does not constitute any investment advice.

This article provides safe and reliable guides to help users access the latest official website of BitMEX exchange and improve transaction security. Due to regulatory and cybersecurity threats, it is crucial to identify the official BitMEX website and avoid phishing websites stealing account information and funds. The article introduces the search for official website portals through trusted cryptocurrency platforms, official social media, news media, and subscribes to official emails. It emphasizes the importance of checking domain names, using HTTPS connections, checking security certificates, and enabling two-factor verification and changing passwords regularly. Remember, cryptocurrency trading is high risk, please invest with caution.

LOOM Coin, a once-highly-known blockchain game and social application development platform token, its ICO was held on April 25, 2018, with an issue price of approximately US$0.076 per coin. This article will conduct in-depth discussion on the issuance time, price and important precautions of LOOM coins, including market volatility risks and project development prospects. Investors should be cautious and do not follow the trend blindly. It is recommended to refer to the official website of Loom Network, blockchain browser and cryptocurrency information platform to obtain the latest information and conduct sufficient risk assessment. The information in this article is for reference only and does not constitute investment advice. Learn about LOOM coins, start here!

The Coinbase exchange web version is popular for its convenience, but secure access is crucial. This article aims to guide users to log in to the official Coinbase web version safely and avoid phishing websites and hackers. We will explain in detail how to verify the official portal through search engines, trusted third-party platforms and official social media, and emphasize security measures such as checking the address bar security lock, enabling two-factor verification, avoiding public Wi-Fi, changing passwords regularly, and being alert to phishing emails to ensure the security of your digital assets. Correct access to the official Coinbase website is the first step to protecting your digital currency. This article will help you start your digital currency trading journey safely.
