How to call a function when close popup window

Question

I am calling the Javascript window.open() function to load another url in a pop up window. When the users closes the popup window, I want the MyThanks() function to be called. How I can do this?

My Script :

<!DOCTYPE html>
<html>
<head>
    <script>
    function openWin(){
        myWindow=window.open('http://facebook.com/ekwebhost','','width=600,height=400,left=200');
        myWindow.focus();
    }

    function MyThanks(){
        alert("Thanks");
    }
    </script>
</head>
<body>

    <input type="button" value="Open window" onclick="openWin()" />

</body>
</html>

Regarding usage of popups:

Are you aware that Facebook & Twitter still use popup windows for user like & follow. Go to http://www.ekwebhost.com and click the Facebook "Like" button or the Twitter "Follow" button. Why can't I use popup windows for my own needs?

Ugh. Pop-up windows, then pop-ups that appear when you close the pop-ups. Are you stuck in 1995? We did away with all this rubbish two decades ago. — Lightness Races in Orbit, Aug 13 '13 at 15:47
Are you aware that Facebook & Twitter still use popup windows for user like & follow. Go to ekwebhost.com and click the Facebook "Like" button or the Twitter "Follow" button. Why can't I use popup windows for my own needs? — Mobo, Aug 13 '13 at 17:27

RustyTheBoyRobot · Answer 1 · 2013-08-13 16:17:19Z

The new window that you open will have an attribute called opener that references the Windowobject that created it. You can then call functions on the parent window by calling window.opener.MyThanks();

Popup:

<script type="text/javascript">
  function closePopup() {
    window.opener.MyThanks();
    window.close();
  }
</script>
<div>
  <h1>My Popup</h1>
  <!-- Form or info to display -->
  <button onclick="closePopup();">Close</button>
</div>

While there is nothing inherently wrong with browser popup windows, they can be annoying since the user can lose them behind other windows. Also, it takes their focus off of your page to do something else. The application that I currently develop is trying to move all of our popup windows to Javascript dialogs. It gets pretty annoying for users once you get 3 popups deep.

There are a bunch of ways to create dialogs within your webpage. jQuery UI is one library that I like.

I have not any control on popup window. So what I can do now? — Mobo, Aug 13 '13 at 16:55
You should add that constraint to your question. If you don't have control over the popup window, how does it close? Does the URL that you load have Javascript to call window.close()? — RustyTheBoyRobot, Aug 13 '13 at 16:58
Go alif.webatu.com and click open window. This will open a facbook fan page in popup window. When page full loaded click on close button (x). I want when you click close button then run MyThanks() function, which I wrote on my script. — Mobo, Aug 13 '13 at 17:19

RustyTheBoyRobot · Answer 2 · 2013-08-13 17:42:26Z

function openWin(){
    myWindow=window.open('http://facebook.com/ekwebhost','','width=600,height=400,left=200');
    // Add this event listener; the function will be called when the window closes
    myWindow.onbeforeunload = function(){ alert("Thanks");}; 
    myWindow.focus();
}

Try this!

You can swap out the function(){ alert("Thanks");}; for MyThanks to call your function.

Note myWindow must be the same variable which you have declared for window.open — deepakb, Aug 13 '13 at 15:47
Works fine for me. This is a better answer than mine, especially if you have no control over the popup content. — RustyTheBoyRobot, Aug 13 '13 at 17:13
I do what you say. Go alif.webatu.com you will see my work. This work before full loaded page. When popup content full loaded it's can't work. So what you suggestion now? — Mobo, Aug 14 '13 at 2:06

일	월	화	수	목	금	토
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30	31

정규 표현식 (0)	2019.02.18
handlebars.js 사용예제.... (0)	2019.02.04
javascript에서 이벤트 처리를 위한 addEventListener() 함수 설명 (0)	2019.01.18
[JavaScript] Date() am / pm (1)	2019.01.13
[JavaScript] IE에서 Date 객체 사용시 Invalid Date 오류 잡기 (0)	2019.01.13

wrkbrs

wrkbrs

현재창을 닫고 다른창의 함수를 호출하기. 본문

현재창을 닫고 다른창의 함수를 호출하기.

How to call a function when close popup window

2 Answers

'JS' 카테고리의 다른 글

티스토리툴바