Mixing
Open popup when clicking on same Div, after popup has closed
I have a Div that should open up a popup with its innerHTML content. However, the click only works once on the same Div. I can click Div 2 and the popup will open, but I want to be able to open Div 1 after Div 1 has been clicked and closed.
Also, if I click the link inside the popup and close the window, Div 1 and Div 2 do not open up the popup anymore.
How to make it so the popup opens again with the content after clicking the same Div, after the popup has closed?
Pure javascript preferred
Minimum example: https://jsfiddle.net/ta4802/9x2Lg3wn/
<div class="m1" onclick="basicPopup('',this);">Text text text text
<p> <a href="http://stackoverflow.com">Link 1</a> </p>
</div>
javascript
asked Nov 20 '18 at 18:33
A AA A
114
add a comment |
I have a Div that should open up a popup with its innerHTML content. However, the click only works once on the same Div. I can click Div 2 and the popup will open, but I want to be able to open Div 1 after Div 1 has been clicked and closed.
Also, if I click the link inside the popup and close the window, Div 1 and Div 2 do not open up the popup anymore.
How to make it so the popup opens again with the content after clicking the same Div, after the popup has closed?
Pure javascript preferred
Minimum example: https://jsfiddle.net/ta4802/9x2Lg3wn/
<div class="m1" onclick="basicPopup('',this);">Text text text text
<p> <a href="http://stackoverflow.com">Link 1</a> </p>
</div>
javascript
asked Nov 20 '18 at 18:33
A AA A
114
The problem would appear to be, when your popup closes, it doesn't notify the original window to set popupwindow to null.
– Snowmonkey
Nov 20 '18 at 18:40
add a comment |
I have a Div that should open up a popup with its innerHTML content. However, the click only works once on the same Div. I can click Div 2 and the popup will open, but I want to be able to open Div 1 after Div 1 has been clicked and closed.
Also, if I click the link inside the popup and close the window, Div 1 and Div 2 do not open up the popup anymore.
How to make it so the popup opens again with the content after clicking the same Div, after the popup has closed?
Pure javascript preferred
Minimum example: https://jsfiddle.net/ta4802/9x2Lg3wn/
<div class="m1" onclick="basicPopup('',this);">Text text text text
<p> <a href="http://stackoverflow.com">Link 1</a> </p>
</div>
javascript
asked Nov 20 '18 at 18:33
A AA A
114
I have a Div that should open up a popup with its innerHTML content. However, the click only works once on the same Div. I can click Div 2 and the popup will open, but I want to be able to open Div 1 after Div 1 has been clicked and closed.
Also, if I click the link inside the popup and close the window, Div 1 and Div 2 do not open up the popup anymore.
How to make it so the popup opens again with the content after clicking the same Div, after the popup has closed?
Pure javascript preferred
Minimum example: https://jsfiddle.net/ta4802/9x2Lg3wn/
<div class="m1" onclick="basicPopup('',this);">Text text text text
<p> <a href="http://stackoverflow.com">Link 1</a> </p>
</div>
javascript
javascript
asked Nov 20 '18 at 18:33
A AA A
114
asked Nov 20 '18 at 18:33
A AA A
114
asked Nov 20 '18 at 18:33
A AA A
114
asked Nov 20 '18 at 18:33
A AA A
114
asked Nov 20 '18 at 18:33
A AA A
114
114
The problem would appear to be, when your popup closes, it doesn't notify the original window to set popupwindow to null.
– Snowmonkey
Nov 20 '18 at 18:40
add a comment |
The problem would appear to be, when your popup closes, it doesn't notify the original window to set popupwindow to null.
– Snowmonkey
Nov 20 '18 at 18:40
The problem would appear to be, when your popup closes, it doesn't notify the original window to set popupwindow to null.
– Snowmonkey
Nov 20 '18 at 18:40
The problem would appear to be, when your popup closes, it doesn't notify the original window to set popupwindow to null.
– Snowmonkey
Nov 20 '18 at 18:40
add a comment |
2 Answers
2
active
oldest
votes
So using the code from your fiddle, I changed two things: first, I moved the var inside the function (doesn't need to be global), and second, I added a popupwindow.onUnload handler:
popupWindow.onUnload = function(){
popupWindow = null;
}
Adding that, when the window closes, the variable is cleared. Which would affect your if(...) statement. :)
See it working here.
answered Nov 20 '18 at 18:44
SnowmonkeySnowmonkey
3,00011012
So the var was global because I specifically do not want the Div to be clickable if the content is the same. Disregarding that, this solves problem 1, but not problem 2, where if I click the link inside the popup, then click the Div again, the content does not refresh to the innerHTML.
– A A
Nov 20 '18 at 21:08
SO, in case two, if the content of the popup changes, you need to listen for the popstate event. I think. stackoverflow.com/questions/3522090/…
– Snowmonkey
Nov 23 '18 at 21:34
Thanks for the answer. I did some digging on the popstate event on Mozilla Devs, and it looks like popstate pushState() method only works with same origin URLs, not external URLs (which is what I have), so I don't think this would work.
– A A
Nov 25 '18 at 4:04
add a comment |
You just have to remove or comment these lines from your code:
if (popupWindow && popupWindow.document.body.innerHTML == t1.innerHTML) {
return false; //if equal do nothing
}
When you click the Div1 link for the first time the popupWindow variable gets set and its innerHTML its given by the Div1 innerHTML. If you click again the link in Div1 this condition meets and the function returns false.
answered Nov 20 '18 at 18:46
ednincerednincer
718615
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53399372%2fopen-popup-when-clicking-on-same-div-after-popup-has-closed%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
So using the code from your fiddle, I changed two things: first, I moved the var inside the function (doesn't need to be global), and second, I added a popupwindow.onUnload handler:
popupWindow.onUnload = function(){
popupWindow = null;
}
Adding that, when the window closes, the variable is cleared. Which would affect your if(...) statement. :)
See it working here.
answered Nov 20 '18 at 18:44
SnowmonkeySnowmonkey
3,00011012
So the var was global because I specifically do not want the Div to be clickable if the content is the same. Disregarding that, this solves problem 1, but not problem 2, where if I click the link inside the popup, then click the Div again, the content does not refresh to the innerHTML.
– A A
Nov 20 '18 at 21:08
SO, in case two, if the content of the popup changes, you need to listen for the popstate event. I think. stackoverflow.com/questions/3522090/…
– Snowmonkey
Nov 23 '18 at 21:34
Thanks for the answer. I did some digging on the popstate event on Mozilla Devs, and it looks like popstate pushState() method only works with same origin URLs, not external URLs (which is what I have), so I don't think this would work.
– A A
Nov 25 '18 at 4:04
add a comment |
So using the code from your fiddle, I changed two things: first, I moved the var inside the function (doesn't need to be global), and second, I added a popupwindow.onUnload handler:
popupWindow.onUnload = function(){
popupWindow = null;
}
Adding that, when the window closes, the variable is cleared. Which would affect your if(...) statement. :)
See it working here.
answered Nov 20 '18 at 18:44
SnowmonkeySnowmonkey
3,00011012
So the var was global because I specifically do not want the Div to be clickable if the content is the same. Disregarding that, this solves problem 1, but not problem 2, where if I click the link inside the popup, then click the Div again, the content does not refresh to the innerHTML.
– A A
Nov 20 '18 at 21:08
SO, in case two, if the content of the popup changes, you need to listen for the popstate event. I think. stackoverflow.com/questions/3522090/…
– Snowmonkey
Nov 23 '18 at 21:34
Thanks for the answer. I did some digging on the popstate event on Mozilla Devs, and it looks like popstate pushState() method only works with same origin URLs, not external URLs (which is what I have), so I don't think this would work.
– A A
Nov 25 '18 at 4:04
add a comment |
So using the code from your fiddle, I changed two things: first, I moved the var inside the function (doesn't need to be global), and second, I added a popupwindow.onUnload handler:
popupWindow.onUnload = function(){
popupWindow = null;
}
Adding that, when the window closes, the variable is cleared. Which would affect your if(...) statement. :)
See it working here.
answered Nov 20 '18 at 18:44
SnowmonkeySnowmonkey
3,00011012
So using the code from your fiddle, I changed two things: first, I moved the var inside the function (doesn't need to be global), and second, I added a popupwindow.onUnload handler:
popupWindow.onUnload = function(){
popupWindow = null;
}
Adding that, when the window closes, the variable is cleared. Which would affect your if(...) statement. :)
See it working here.
answered Nov 20 '18 at 18:44
SnowmonkeySnowmonkey
3,00011012
answered Nov 20 '18 at 18:44
SnowmonkeySnowmonkey
3,00011012
answered Nov 20 '18 at 18:44
SnowmonkeySnowmonkey
3,00011012
answered Nov 20 '18 at 18:44
SnowmonkeySnowmonkey
3,00011012
3,00011012
So the var was global because I specifically do not want the Div to be clickable if the content is the same. Disregarding that, this solves problem 1, but not problem 2, where if I click the link inside the popup, then click the Div again, the content does not refresh to the innerHTML.
– A A
Nov 20 '18 at 21:08
SO, in case two, if the content of the popup changes, you need to listen for the popstate event. I think. stackoverflow.com/questions/3522090/…
– Snowmonkey
Nov 23 '18 at 21:34
Thanks for the answer. I did some digging on the popstate event on Mozilla Devs, and it looks like popstate pushState() method only works with same origin URLs, not external URLs (which is what I have), so I don't think this would work.
– A A
Nov 25 '18 at 4:04
add a comment |
So the var was global because I specifically do not want the Div to be clickable if the content is the same. Disregarding that, this solves problem 1, but not problem 2, where if I click the link inside the popup, then click the Div again, the content does not refresh to the innerHTML.
– A A
Nov 20 '18 at 21:08
SO, in case two, if the content of the popup changes, you need to listen for the popstate event. I think. stackoverflow.com/questions/3522090/…
– Snowmonkey
Nov 23 '18 at 21:34
Thanks for the answer. I did some digging on the popstate event on Mozilla Devs, and it looks like popstate pushState() method only works with same origin URLs, not external URLs (which is what I have), so I don't think this would work.
– A A
Nov 25 '18 at 4:04
So the var was global because I specifically do not want the Div to be clickable if the content is the same. Disregarding that, this solves problem 1, but not problem 2, where if I click the link inside the popup, then click the Div again, the content does not refresh to the innerHTML.
– A A
Nov 20 '18 at 21:08
So the var was global because I specifically do not want the Div to be clickable if the content is the same. Disregarding that, this solves problem 1, but not problem 2, where if I click the link inside the popup, then click the Div again, the content does not refresh to the innerHTML.
– A A
Nov 20 '18 at 21:08
SO, in case two, if the content of the popup changes, you need to listen for the popstate event. I think. stackoverflow.com/questions/3522090/…
– Snowmonkey
Nov 23 '18 at 21:34
SO, in case two, if the content of the popup changes, you need to listen for the popstate event. I think. stackoverflow.com/questions/3522090/…
– Snowmonkey
Nov 23 '18 at 21:34
Thanks for the answer. I did some digging on the popstate event on Mozilla Devs, and it looks like popstate pushState() method only works with same origin URLs, not external URLs (which is what I have), so I don't think this would work.
– A A
Nov 25 '18 at 4:04
Thanks for the answer. I did some digging on the popstate event on Mozilla Devs, and it looks like popstate pushState() method only works with same origin URLs, not external URLs (which is what I have), so I don't think this would work.
– A A
Nov 25 '18 at 4:04
add a comment |
You just have to remove or comment these lines from your code:
if (popupWindow && popupWindow.document.body.innerHTML == t1.innerHTML) {
return false; //if equal do nothing
}
When you click the Div1 link for the first time the popupWindow variable gets set and its innerHTML its given by the Div1 innerHTML. If you click again the link in Div1 this condition meets and the function returns false.
answered Nov 20 '18 at 18:46
ednincerednincer
718615
add a comment |
You just have to remove or comment these lines from your code:
if (popupWindow && popupWindow.document.body.innerHTML == t1.innerHTML) {
return false; //if equal do nothing
}
When you click the Div1 link for the first time the popupWindow variable gets set and its innerHTML its given by the Div1 innerHTML. If you click again the link in Div1 this condition meets and the function returns false.
answered Nov 20 '18 at 18:46
ednincerednincer
718615
add a comment |
You just have to remove or comment these lines from your code:
if (popupWindow && popupWindow.document.body.innerHTML == t1.innerHTML) {
return false; //if equal do nothing
}
When you click the Div1 link for the first time the popupWindow variable gets set and its innerHTML its given by the Div1 innerHTML. If you click again the link in Div1 this condition meets and the function returns false.
answered Nov 20 '18 at 18:46
ednincerednincer
718615
You just have to remove or comment these lines from your code:
if (popupWindow && popupWindow.document.body.innerHTML == t1.innerHTML) {
return false; //if equal do nothing
}
When you click the Div1 link for the first time the popupWindow variable gets set and its innerHTML its given by the Div1 innerHTML. If you click again the link in Div1 this condition meets and the function returns false.
answered Nov 20 '18 at 18:46
ednincerednincer
718615
answered Nov 20 '18 at 18:46
ednincerednincer
718615
answered Nov 20 '18 at 18:46
ednincerednincer
718615
answered Nov 20 '18 at 18:46
ednincerednincer
718615
718615
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53399372%2fopen-popup-when-clicking-on-same-div-after-popup-has-closed%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
The problem would appear to be, when your popup closes, it doesn't notify the original window to set popupwindow to null.
– Snowmonkey
Nov 20 '18 at 18:40