Home > Developer > JavaScript
HTML prevents iframe from redirecting to a page and uses iframe to embed a webpage version on the page.
Yesterday, I saw the first anniversary of the [top-up] Open-source component NanUI-using HTML, CSS, and JS to build the. Net Winform application interface.
Just want to get a winform that combines html5 with a little thing, suddenly interested, want to nest a web version inside.
Okay. When you come up with an idea, let's take action. The final effect is as follows:
At the beginning, I planned to nest an iframe in the page to point to the https://wx.qq.com and it was OK, but I am still too naive, the page version will automatically jump. The result is as follows:
So I searched the internet to prevent iframe redirection. I added the security = "restricted" sandbox = "" attribute to the iframe tag. The former is the function of IE to prohibit js, and the latter is the function of HTML5.
Usesandbox="allow-scripts allow-same-origin allow-popups"This prevents redirection. However, the result is as follows:
Then we found that this jump is actually to close the original page and then browse to the jump page. Therefore, you can use the page to close the event onbeforeunload to prevent redirection. Add the following code to the page:
1 document.body.onbeforeunload = function (event) {2 var rel = "asdfawfewf";3 if (!window.event) {4 event.returnValue = rel;5 } else {6 window.event.returnValue = rel;7 }8 };
The result is as follows:
Why? The incident did not respond? Or is the webpage jump too good? Directly ignore this event? So I created a blank html file and added the event for verification.
1 <!DOCTYPE html> 2 3The result is feasible:
However, after the iframe is embedded in the page, the page jumps directly. You can try the code below.
1 <!DOCTYPE html> 2 3When there is no plan, I keep turning it on and closing and trying to verify that this method has taken effect. Suddenly, if the page is closed within a short period of time, the onbeforeunload event will not be triggered. If you close the page a few seconds later, an event will be triggered.
Come on, try the iframe delay value for src (JQuery is referenced here ).
1 <!DOCTYPE html> 2The result is successful. A prompt is displayed, indicating whether to leave the page. Click the left button. No jump is successful. Finished image for me.
You can chat and upload files normally, but not.
The disadvantage is that you need to click the Clear button to cancel the login, and you need to open the page twice for the first time. After the second scan, the page will be redirected again. There is no way to solve this problem. If you want to solve this problem, you can give me some suggestions ~~
Well, this is the first time you write a blog. Sorry, haha.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
