Button onclick delete another browser window - javascript

I have two web pages.
First.html:
<script> window.onload = function(){ setTimeout(loadAfterTime, 3000) }; function loadAfterTime() { my_window = window.open("Second.html", "","status=1,width=100%,height=100%");}
this.window = previous_window ;
</script>
Second.html:
<html>
<head>
<script>
function closepopup()
   {
      if(false == previous_window.closed)
      {
         previous_window.close ();
      }
      else
      {
         alert('Window already closed!');
      }
   }
</script>
</head>
<body>
<button onclick="closepopup();">
Close
</button>
</body>
</html>
If we load first.html in a browser, after 3 seconds of load, the JavaScript will make a browser window with the URL set into Second.html.
I have added a button in the second.html file.
If we press that button, I want to delete/remove the previous browser window (first.html).
The window.open is working button window.close is not.
Please help.
Also, the code should perfectly work on mobile devices(Latest Chrome app on Android and IOS).
Any help will be appreciated.

First.html
<script>
window.onload = setTimeout(loadAfterTime, 3000);
function loadAfterTime()
{
window.open("Second.html","","status=1,width=100%,height=100%");
}
</script>
Second.html
<html>
<head>
<script>
function closepopup()
{
if(window.opener)
{
window.opener.close();
}
else
{
alert("Window already closed!");
}
}
</script>
</head>
<body>
<button onclick="closepopup();">Close</button>
</body>
</html>

Related

Javascript, Make a loop between 2 Pages and set a timer on 1

I want to create a while loop between 2 html page (Or a prompt where I can ask a question) and make so that if I give the wrong answer I get redirected to another HTML page that will remain for 5 seconds before getting back to the prompt.
I am trying the following code
<!DOCTYPE html>
<html>
<body>
<script>
var pass;
pass = prompt("The corret answer is 1");
if (pass == "1") {
document.location.href = "https://stackoverflow.com/questions/40539097/redirect-user-to-another-html-page-if-the-condition-is-true";
} else {
setTimeout(function(){
window.location.href = 'prova2.html';
}, 5000);
}
</script>
<body>
</html>
The Problem is that the page "prova2.html" came out after 5 second.
Instead I want that it remain visible for 5 seconds.
But that's exactly what your code does: if the result of prompt is '1' it redirects to SO, otherwise you start a timer that redirects to prova2 after 5 seconds.
If you want the behaviour you're describing, you need to redirect to prova2.html immediately and in the code for prova2.html you need to set a timeout that redirects you back after 5 seconds:
in original.html (or whatever it's called for you):
<!DOCTYPE html>
<html>
<body>
<script>
var pass = prompt("The corret answer is 1");
if (pass == "1") {
document.location.href = "https://stackoverflow.com/questions/40539097/redirect-user-to-another-html-page-if-the-condition-is-true";
} else {
document.location.href = 'prova2.html';
}
</script>
<body>
</html>
in prova2.html:
<!DOCTYPE html>
<html>
<body>
<script>
setTimeout(() => {
document.location.href = 'original.html';
}, 5000)
</script>
<body>
</html>
This example of prova2.html does not rely on filenames, it uses the session history of the browser:
<!DOCTYPE html>
<html>
<body>
<script>
document.addEventListener("DOMContentLoaded", function(event) {
setTimeout(function(){
history.back();
//window.location.href = 'previous.html';
}, 5000);
});
</script>
<p>5 sec after pageload you should get redirected back</p>
<body>
</html>
Source: https://developer.mozilla.org/en-US/docs/Web/API/History/back

allow reload but not page closing using javascript/jquery

i want to give warning message to users when they try to close the webpage.the below code is working just fine but i want to refresh the page after every 60 seconds and this code is not allowing to refresh automatically.it gives warning message for refresh as well. but i want to show warning message only for closing when users click on close tab
<html>
<head><meta http-equiv="refresh" content="60;url=test.html"/>
<script type="text/javascript">
var hook = true;
window.onbeforeunload = function() {
if (hook) {
return "msg here"
}
}
function unhook() {
hook=false;
}
</script>
</head>
<body>
</body>
</html>
Your unhook method is not getting called anywhere. To do so you can refresh the page using
Javascript where you can call unhook also as shown velow.
<html>
<head>
<script type="text/javascript">
var hook = true;
window.onbeforeunload = function() {
if (hook) {
return "msg here"
}
}
function unhook() {
hook=false;
}
setInterval(function(){
unhook();
window.location.reload()
}, 60000);
</script>
</head>
<body>
</body>
</html>
The script in set interval is called after 60000 milli-seconds (i.e. 1 min) which allows you to first set hook=false and then refresh.
You can do it like this:
<script type="text/javascript">
$(document).ready(function(){
setTimeout(function(){
window.location.reload(); // This will refresh the page
}, 60000); // 60 seconds
});
</script>

Javascript not executing when right clicked into new tab

Here is my simple code
function goto() {
/* Some code to be executed */
if (a == "1")
location.href = "http://www.google.com";
else
location.href = "http://www.example.com";
}
And here is html
Hello
this works perfectly fine when i click normally but if i right click it and open in a new tab it doesn't execute.
try this:
Hello
function goto() {
/* Some code to be executed */
window.open("http://www.google.com");
}
if you want to open in new tab on mouse right click,
Hello
hit mouse right click and open in new tab
OR
u can try this:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="jquery.min.js"></script>
<script>
function goto() {
window.location = "http://www.google.com";
}
document.addEventListener('DOMContentLoaded', function () {
document.getElementsByTagName('a')[0].addEventListener('contextmenu', function (ev) {
ev.stopPropagation();
ev.preventDefault();
goto();
});
document.getElementsByTagName('a')[0].addEventListener('click', function (ev) {
goto();
});
}, false)
</script>
</head>
<body>
Hello
</body>
</html>
Try something like this:
Hello
<script>
document.getElementById('myId').addEventListener('contextmenu', function(ev){
gotoFunc(ev);
});
function gotoFunc(ev){
//run this when right clicked over #myId element
}
</script>
do it like this:
function changeDest(elem) {
/* Some code to be executed */
if (a == "1")
elem.href = "http://www.google.com";
else
elem.href = "http://www.example.com";
}
Hello
you can instead use Hello
This should do the trick. i.e adding the url to the href of the anchor tag

Redirect from iFrame using javascript or Jquery

If a website is loaded into an iframe, what code do I need to put on the child page of that iFrame to break out of the iFrame and load that page as the top document or reidrect to that page
Just found the code
<script>
if(window.top !== window.self){
window.top.location.href = "http://www.blah.com";
}
</script>
Even better code:
<style> html{display : none ; } </style>
<script>
if( self == top ) {
document.documentElement.style.display = 'block' ;
} else {
top.location = self.location ;
}
</script>
Code Example below:
<!DOCTYPE html>
<html lang="en">
<head>
blah
</head>
<body>
<iframe src="www.blah.com"></iframe>
</body>
</html>
What JQuery or javascript do I need to put on (in this example) www.blah.com so it breaks out of the iframe and www.blah.com is directly shown to the user?
What you're looking for is called a Framekiller
Here's the suggested implementation from that article:
<style> html{display : none ; } </style>
<script>
if( self == top ) {
document.documentElement.style.display = 'block' ;
} else {
top.location = self.location ;
}
</script>
This should work:-
<script type="text/javascript">
if (window!=top){top.location.href=location.href;}
</script>
window.top.location.href = "http://blah.com/";
As mentioned here (with a fuller explanation):
Redirect parent window from an iframe action
If you are using a link setting target="_top" attribute probably would do the job.

Opening a new tab on Google Chrome Extension

This is my background.html file, It works fine when opening in current tab but I want it to open in new tab, what am I doing wrong?
<html>
<head>
<script>
// Called when the user clicks on the browser action.
chrome.browserAction.onClicked.addListener(function(tab) {
var action_url = "javascript:location.href='http://www.reddit.com/submit?url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title)";
chrome.tabs.create(tab.id, {url: action_url}, function(tab));
});
</script>
</head>
</html>
You should read the chrome.tabs.create documentation again. You are passing it invald parameters. You are also using location which is from the background.html document not the webpage document the code is expecting instead of the tab parameter passed to the chrome.browserAction.onClicked listener.
<html>
<head>
<script>
// Called when the user clicks on the browser action.
chrome.browserAction.onClicked.addListener(function(tab) {
var action_url = "http://www.reddit.com/submit?url=" + encodeURIComponent(tab.href) + '&title=' + encodeURIComponent(tab.title);
chrome.tabs.create({ url: action_url });
});
</script>
</head>
</html>
You can try this
<html>
...
<body>
<script>
function createTab() {
chrome.tabs.create({url: "http://www.stackoverflow.com"});
}
</script>
Create a new tab
</body>
</html>
<html>
<head>
<script type="text/javascript">
window.master = ({
newtab: function(url, callback) {
callback = callback === true ? (function() { this.close(); }) : callback;
try {
chrome.tabs.create({
url: url
});
if(typeof callback === "function") { callback.call(this, url); }
} catch(e) {
/* Catch errors due to possible permission issues. */
}
},
link: function(event, close) {
event = event ? event : window.event;
event.preventDefault();
this.newtab(event.href, close);
},
close: function() { window.self.close(); }
});
</script>
</head>
<body>
<!-- Usage is simple:
HTML:
<a href="http://example.com/" onclick="master.link(event)" />
JavaScript:
master.newtab("http://example.com/", true);
-->
</body>
</html>
If you insist on using a popup and want it to close as soon as it is opened, then use what is above. Simply add the link string and a true boolean to the master.newtab function to have it open the new tab and then close the popup.
If you change your mind about closing the popup, you can replace the true boolean with a function to execute if the new tab was created without any errors. You can also use the master.link function for calling the master.newtab function from an anchor element.
The best thing about using Chrome Extensions is you never have to worry about support issues! :D

Categories