I have a page that has a text box and a button. With the onclick of the button I want a new tab to display: http://www.google.com/ncr After 5 seconds, this tab should close and bring the user back to main page.
After 5 sec it should open the specified url (written on first script) in a new tab. Howerver, with the delay script running, it doesn't open new tab... rather it shows me a "pop up blocked" message. It asks to allow popup and when I allow, it opens the requested url. I do not want to allow the pop up manually.
CODE
<form>
<input type="text" id="mySearch" name="search">
<button id="shopid" onclick="openLink()" class="shop">Search</button>
</form>
<script>
var link;
function openLink(){
var x = document.getElementById("mySearch");
var currentVal = x.value;
var shop_url = "https://www.google.com/search?output=search&tbm=shop&q=" + currentVal;
link = window.open(shop_url);
}
setTimeout('openLink', 9000);
</script>
<script type="text/javascript">
(function() {
document.getElementById("shopid").onclick = function() {
var wnd = window.open("http://www.google.com/ncr");
setTimeout(function() {
wnd.close();
}, 5000);
return false;
};
})();
</script>
Related
After some speech-to-text conversion into the $searchText variable, I show a button.
By clicking this button, you trigger a search from google.
However, I want to enter a text which automatically starts a search (without clicking on a button).
Example: If, after 3 seconds, $searchText is not empty, it searches automatically without clicking a button. I am a beginner. Can you help?
$button.addEventListener('click', () => {
if ($searchText.value !== '') {
var url = 'https://www.google.com/search?q=' + $searchText.value;
window.open(url, '_blank');
}
});
I have added an input box for simplifying. I believe you want something like this.
<!DOCTYPE html>
<html lang="en">
<body>
<!-- Your searchbox -->
<input type="text" id="searchText">
<script>
let timerID = null;
const $searchText = document.getElementById("searchText");
$searchText.addEventListener('input', () => {
clearTimeout(timerID)
if (!$searchText.value) {
return ;
}
timerID = setTimeout(() => {
const url = 'https://www.google.com/search?q=' + $searchText.value;
window.open(url, '_blank');
}, 3000 /* 3 seconds */)
});
</script>
</body>
</html>
I have a code for button in html:
<button class="btn btn-default" (click)="openUrl()"> Open </button>
And in app.component.ts, the first page is https://example.com, I have below code:
openUrl(){
window.location.href = 'http://example.com/url';
}
I have exit button in http://example.com/url page. When they click on exit button, the url changes to http://example.com/url/exit. Then, it should redirect to the original page https://example.com after 15 seconds.
How to listen to url of exit button and redirect the page to original one. The issue here is I have already exited the original page.
You could use an iFrame and do something like this maybe.
function removeIFrame() {
var frame = document.getElementById("iframe");
frame.parentNode.removeChild(frame);
}
function updateIframe(loc) {
var frame = document.getElementById("frame1");
console.info(frame.contentWindow);
if (frame.contentWindow.location == "example.com/exit") {
removeIframe();
}
}
function showIframe() {
var ele = document.getElementById("frameWrapper");
ele.style.display = "block";
}
<div style="display:none;" id="frameWrapper">
<iframe id="frame1" src="example.com/url" onLoad="updateIframe();"></iframe>
</div>
If it's ok to open the second page in a new tab then you can use window.open:
let newTab = window.open("//www.google.com", "_blank"); setTimeout(() => { newTab.close()},15000);
I am trying to write a simple programm, that will have a button.
When I click the button it will open up a popup window.
When I close the popup I want my parent page to be reloaded
After the window is closed, I want the parent page to know, that the child was closed, so it should print some message.
I tried to implement this setting a cookie in the js function and reading it in the php. Unfortunaly as soon as I close the window once, I always get the print message, when I reload the page. Here is my code:
<?php
if (isset($_COOKIE['cookie'])) {
unset($_COOKIE['cookie']);
setcookie("cookie", "", time()-3600, "/");
echo "window closed";
}
?>
<script>
function popup() {
var win = window.open("", "Page Title", "toolbar=no, location=no");
var win_timer = setInterval(function() {
if(win.closed) {
window.location.reload();
clearInterval(win_timer);
document.cookie = "cookie=cookieValue";
}
}, 100);
}
</script>
<input type="button" value="Open popup" onclick="javascript: return popup()" />
I have a Parent page in which, I have added a search functionality.
like below
function FunClick(StrPriCaption) {
var StrPriHTML = "";
if (StrPriCaption == 'AdvSearch') {
//document.getElementById('TxtCondition').value = "AdvSearch";
//form1.submit();
var StrPriReturnValue = "";
window.open('FrmInwardHdrAdvanceSearch.aspx', null, 'height=370,width=630,top=0,left=0,resizable=yes,scrollbars=yes');
}
}
And it works perfectly. It opens a pop up window page for me to search for.
But now what I want is, IF I close the pop up,I want to refresh the parent page.
I tried with below code in Child page, but it didn't refreshed the parent page.
function CloseWindow() {
window.close();
window.opener.location.reload();
}
How can I do this using Javascript?
Method 1
<script>
function popup() {
var win = window.open("", "Page Title", "toolbar=no, location=no");
win.document.body.innerHTML = 'Close Me';
}
</script>
Open Me
It creates a popup with a link to close the window and refresh parent.
Demo: https://jsfiddle.net/eke4f72r/
Method 2
<script>
function popup() {
var win = window.open("", "Page Title", "toolbar=no, location=no");
var win_timer = setInterval(function() {
if(win.closed) {
window.location.reload();
clearInterval(win_timer);
}
}, 100);
}
</script>
Open Me
It detects from the parent window if child is closed. If true, it reloads the page.
Demo: https://jsfiddle.net/gv6nmdn9/
EDIT When using method 1, make your parent to open the popup you want and just add this in your child:
Close Me
Detect it in parent page:
iframe=window.open("");
iframe.onclose=function(){
window.location="redirect";
};
how to show only one popup at a time?
i have created one page called parent.html. On parent page, i have two links one is register and another is login.
if i click register then register page open as child window
but
if i click login then already opened child box(register) should close and login child window should open or all previously opened child box should disappear.
my code is as below
<input type="button" value="login" onclick="ShowPopup('login.asp')" />
<script type="text/javascript">
var popup;
function ShowPopup(url) {
popup = window.open(url, "self", "toolbar=no,scrollbars=no,location=no,statusbar=no,menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
popup.focus();
}
</script>
</form>
<input type="button" value="register" onclick="ShowPopup('register.asp')" />
<script type="text/javascript">
var popup;
function ShowPopup(url) {
popup = window.open(url, "self", "toolbar=no,scrollbars=no,location=no,statusbar=no,menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
popup.focus();
}
</script>
</form>
i replaced "popup" with "self". now only one child window open at a time instead of multi and working perfect.
but when i close child window, parent page is not refreshing.
child window code as below
<form id="form1" runat="server">
<input type="button" value="Refresh Parent" onclick="RefreshParent()" />
<script type="text/javascript">
function RefreshParent() {
if (window.opener != null && !window.opener.closed) {
window.opener.location.reload();
}
}
window.onbeforeunload = RefreshParent;
</script>
</form>
please help me out
First thing , there is no need to define variable & function again .. and now coming to solution as --
<script type="text/javascript">
var popup;
function ShowPopup(url) {
if(popup)
{
popup.close();
}
popup = window.open(url, "Popup", "toolbar=no,scrollbars=no,location=no,statusbar=no,
menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
popup.focus();
}
</script>
In Your Child Page ,Head Section (To refresh parent window on close)
<script>
window.onunload = refreshParent;
function refreshParent() {
if(window.opener)
window.opener.location.reload(true);
}
</script>
By default, the reload() method reloads the page from the cache, but you can force it to reload the page from the server by passing parameter to true.
-- OR --
You can also some code in parent while you open a child window and look up for its child window if its close refresh itself..
<script type="text/javascript">
var popup;
var lookupTimer=null;
function ShowPopup(url) {
if(popup)
{
popup.close();
}
popup = window.open(url, "Popup", "toolbar=no,scrollbars=no,location=no,
statusbar=no,menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
popup.focus();
lookupTimer = setInterval(function(){ loolUpChild(); }, 1000);
}
function loolUpChild()
{
if((popup.closed))
{
window.location.reload(true);
clearInterval(lookupTimer);
}
}
</script>
create a global variable and maintain your flag if previous popup is open then close first and open new
Like
if(popup){
popup.close();
popup=false;
}
after that open new
window.open(url, "Popup", "toolbar=no,scrollbars=no,location=no,statusbar=no,menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
popup = true;