Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

How to have popup pull <href> from different parent files? 1

Status
Not open for further replies.
bucephalushtml

bucephalushtml

Vendor
Jun 24, 2002
19
0
0
US
I'm looking for a way to have a single popup window, that (depending on the html file that calls it) will have a link to another site.

I work with a large site, and I have been asked to have a single popup that notifies the user that they are about to leave our site. This popup will show for every link that goes outsite of our site. Instead of coding dozens of popups, I was wondering if there is a way to have the popup window pull a specified url from the orginating html file and use it as a link on the popup.

Example:

index.html has outside link -> popup will call to the index.html code for the URL to that link and place it into the <a href> in the popup code.

indexpage2.html has another outside link (completely different) - same popup comes up but when continue is click it pulls the url from indexpage2.html code.

Is this possible, and how would I go about it?
Also this must work with IE5 and NS4.7.

Thanks
 
Sort by date Sort by votes
Pack it in the query string.

F'rinstance:
index.html would build the link:
[tt]
document.write('<a target=&quot;_blank&quot; href=&quot;popup.html?url='+
escape('[/tt]
popup.htm would parse the url and build the link:
[tt]
<head>
<script type=&quot;text/javascript&quot;>
<!--

var qs=this.location.href;
var n=qs.indexOf('?');
qs=(n>0?qs.substring(n+1):'');
var aryQS=qs.split('&');
for(n=0;n<aryQS.length;n++){
aryQS[n]=aryQS[n].split('=');
}

function requestQueryString(value){
var s='';
if(qs.length>0){
for(n=0;n<aryQS.length;n++){
if(value==aryQS[n][0]){
s=aryQS[n][1];
break;
}
}
}
return(s);
}

//-->
</script>
</head>
[/tt] ... some more page code in the body [tt]

<script type=&quot;text/javascript&quot;>
var s=requestQueryString('url');
if(s.length>0){
document.write('<a target=&quot;_blank&quot; href=&quot;'+s+'&quot;>');
}
</script>
[/tt]

See if that works for ya! Paul Ellis
[hammer] I've been programming since you had to punch holes in cards to code. (Always remember, number your cards!)
 
Upvote 0 Downvote
Thanks Paul works great!!

I do have a small problem that I forgot about. There will be pages that have multiple outside links. I still need one popup that will recode the <href> for different links. So how would the popup querry each individual link on parent page for the current <href>.
 
Upvote 0 Downvote
Hmmmm. I'm not sure I follow, because the first thing that comes to my mind is to just cram the extras into the query string:
[tt]
?url1=blah&url2=blahblah&url3=blahblahblah
[/tt}

? Paul Ellis
[hammer] I've been programming since you had to punch holes in cards to code. (Always remember, number your cards!)
 
Upvote 0 Downvote
Maybe it will help if I show you what I've got.
This functions but I would rather not have to start a new script everytime I add an outside link.


<html>
<head>
<title>page one</title>
<SCRIPT language=&quot;JavaScript&quot;><!--
function popup(url){
popwin = window.open(url, &quot;popwin&quot;, &quot;location=no,width=350,height=300&quot;);
var outsideurl = &quot;<a href=' target='new'>continue</a>&quot;;
popwin.document.write(outsideurl);
popwin.document.close();
}
//--></SCRIPT>
<SCRIPT language=&quot;JavaScript&quot;><!--
function popup2(url){
popwin = window.open(url, &quot;popwin&quot;, &quot;location=no,width=350,height=300&quot;);
var outsideurl = &quot;<a href=' target='new'>continue</a>&quot;;
popwin.document.write(outsideurl);
popwin.document.close();
}
//--></SCRIPT>
<SCRIPT language=&quot;JavaScript&quot;><!--
function popup3(url){
popwin = window.open(url, &quot;popwin&quot;, &quot;location=no,width=350,height=300&quot;);
var outsideurl = &quot;<a href=' target='new'>continue</a>&quot;;
popwin.document.write(outsideurl);
popwin.document.close();
}
//--></SCRIPT>
</head>
<table width=&quot;600&quot; border=&quot;0&quot; cellspacing=&quot;0&quot; cellpadding=&quot;0&quot;>
<tr><td>
<!-- BEGIN CONTENT -->
<table width=&quot;443&quot; border=&quot;0&quot; cellspacing=&quot;0&quot; cellpadding=&quot;0&quot;>
<tr><td><a href=&quot;javascript:popup('leave.html')&quot;>leave</a></td></tr>
<tr><td> </td></tr>
<tr><td> </td></tr>
</table>

<table width=&quot;443&quot; border=&quot;0&quot; cellspacing=&quot;0&quot; cellpadding=&quot;0&quot;>
<tr><td><a href=&quot;javascript:popup2('leave.html')&quot;>leave 2</a></td></tr>
<tr><td> </td></tr>
<tr><td> </td></tr>
</table>

<table width=&quot;443&quot; border=&quot;0&quot; cellspacing=&quot;0&quot; cellpadding=&quot;0&quot;>
<tr><td><a href=&quot;javascript:popup3('leave.html')&quot;>leave 3</a></td></tr>
<tr><td> </td></tr>
<tr><td> </td></tr>
</table>



<!-- end white space -->
</td></tr>
<tr><td> </td></tr>
</table>
</html>
 
Upvote 0 Downvote
OK, you've got some options. Here's the way I would approach this, bearing in mind that I'm big on easy code maintainability:

[ol][li]popup.js include file:
[tt]
function popup(url){
window.open(&quot;leave.html?url=&quot;+escape(url), &quot;popwin&quot;, &quot;location=no,width=350,height=300&quot;);
}
[/tt][/li]
[li]leave.html:
[tt]
<html>
<head>
<title>You are leaving our site!</title>
<script type=&quot;text/javascript&quot;>
<!--
var qs=this.location.href;
var n=qs.indexOf('?');
qs=(n>0?qs.substring(n+1):'');
var aryQS=qs.split('&');
for(n=0;n<aryQS.length;n++){
aryQS[n]=aryQS[n].split('=');
}

function requestQueryString(value){
var s='';
if(qs.length>0){
for(n=0;n<aryQS.length;n++){
if(value==aryQS[n][0]){
s=aryQS[n][1];
break;
}
}
}
return(s);
}
//-->
</script>
</head>
<body>
<script type=&quot;text/javascript&quot;>
<!--
function writeLink(){
var s=requestQueryString('url');
if(s.length>0){
document.write('<a target=&quot;_blank&quot; href=&quot;'+unescape(s)+'&quot; onclick=&quot;self.close();>continue</a>');
}
}

window.onload=writeLink;
//-->
</script>
</body>
</html>
[/tt][/li]
[li] ... and finally pageone.html:
[tt]
<html>
<head>
<title>page one</title>
<script language=&quot;JavaScript&quot; src=&quot;popup.js&quot;></script>
</head>
</body>
<table width=&quot;600&quot; border=&quot;0&quot; cellspacing=&quot;0&quot; cellpadding=&quot;0&quot;>
<tr>
<td>
<table width=&quot;443&quot; border=&quot;0&quot; cellspacing=&quot;0&quot; cellpadding=&quot;0&quot;>
<tr><td><a href=&quot;javascript:popup('&quot;>leave</a></td></tr>
<tr><td> </td></tr>
<tr><td> </td></tr>
</table>

<table width=&quot;443&quot; border=&quot;0&quot; cellspacing=&quot;0&quot; cellpadding=&quot;0&quot;>
<tr><td><a href=&quot;javascript:popup('&quot;>leave 2</a></td></tr>
<tr><td> </td></tr>
<tr><td> </td></tr>
</table>

<table width=&quot;443&quot; border=&quot;0&quot; cellspacing=&quot;0&quot; cellpadding=&quot;0&quot;>
<tr><td><a href=&quot;javascript:popup('&quot;>leave 3</a></td></tr>
<tr><td> </td></tr>
<tr><td> </td></tr>
</table>

</td>
</tr>
<tr><td> </td></tr>
</table>
</body>
</html>
[/tt][/li][/ol]
I think that this will address the issue of having to add a new script for every link. The links are now passed to the static ]leave.html via popup.js. Try this out and see if it works for you. It's a bit ugly, but functional. Just be sure your paths for [tt]popwin = window.open(&quot;leave.html ...[/tt] and [tt]<script language=&quot;JavaScript&quot; src=&quot;popup.js&quot;>[/tt] are correct.
Paul Ellis
[hammer] I've been programming since you had to punch holes in cards to code. (Always remember, number your cards!)
 
Upvote 0 Downvote
Paul,

Thanks so much, this is what I was looking to do. I have not tested yet. Will do so tom. Again thanks!!
 
Upvote 0 Downvote
One last issue -

I have a statement and graphics that will need to be on the leave.html file. I would rather not put all of the needed html in document.write statements. How could the URL be built then called into the html without rewriting(recreating) the document?

In advance, Thank you for all your help!

 
Upvote 0 Downvote
Actually leave.html is ideally suited for just that! I skipped that part when I gave you the above code. Now, here it is in all it's cross platform glory (IE5+ and NS4+). Be VERY careful if you decide to edit the red parts.

[tt]
<html>
<head>
<title>You are leaving our site!</title>
<style>
<!-- Actually, the background-color is not needed,
only position:relative
-->
.linkme {position:relative; background-color:#ff0000;}
</style>
<script type=&quot;text/javascript&quot;>
<!--
function isClient(){
this.ver=navigator.appVersion;
this.agent=navigator.userAgent;
this.dom=(document.getElementById?1:0);
this.ie6=((this.ver.indexOf('MSIE 6')>-1&&this.dom)?1:0);
this.ie5=((this.ver.indexOf('MSIE 5')>-1&&this.dom)?1:0);
this.ie4=(this.ver.indexOf('MSIE 4')>-1?1:0);
this.ie=(this.ie4||this.ie5||this.ie6);
this.ns6=((this.dom&&this.agent.indexOf('Netscape6/6.2')>-1)?1:0);
this.ns4=((document.layers&&!this.dom)?1:0);
this.ns=(this.ns6||this.ns4);
this.dhtml=(this.ie6||this.ie5||this.ie4||this.ns4||this.ns6);
this.other=(!this.dhtml);
return this;
}
var is=new isClient();

var qs=this.location.href;
var n=qs.indexOf('?');
qs=(n>0?qs.substring(n+1):'');
var aryQS=qs.split('&');
for(n=0;n<aryQS.length;n++){
aryQS[n]=aryQS[n].split('=');
}

function requestQueryString(value){
var s='';
if(qs.length>0){
for(n=0;n<aryQS.length;n++){
if(value==aryQS[n][0]){
s=aryQS[n][1];
break;
}
}
}
return(s);
}
//-->
</script>
</head>
<body>
<p>You can put any code here you want or no code at all!<p>

<div id=&quot;linkme&quot; class=&quot;linkme&quot; name=&quot;linkme&quot;>Put this DIV tag set where you want the link to appear! P.S. You really don't want any text here.</div>

<p>Here's where some more code can roam, or you can let it alone</p>

<script type=&quot;text/javascript&quot;>
<!--
function writeLink(){
var s=requestQueryString('url');
if(s.length>0){
var obj=(is.ns4?document.linkme:(is.dom?document.getElementById('linkme'):0));
if(obj){
var r='<a target=&quot;new&quot; href=&quot;'+unescape(s)+'&quot; onclick=&quot;window.setTimeout(\'self.close()\',10); return true;&quot;>continue</a>'
if(is.ns4){
obj.document.write('<layer name=&quot;linkmeNS&quot; position=absolute>'+r+'</layer>');
obj.document.close();
obj.document.linkmeNS.left=obj.left;
obj.document.linkmeNS.top=obj.top;
}else if(is.dom){
obj.innerHTML=r;
}
}
}
}

window.onload=writeLink;
//-->
</script>
</body>
</html>
[/tt]

[thumbsup]Hope this helps!
Paul Ellis
[hammer] I've been programming since you had to punch holes in cards to code. (Always remember, number your cards!)
 
Upvote 0 Downvote
Paul,

THANKS bunches, smooth as silk! Your the man!! Have a great weekend!
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lexer
  • Locked
  • Question
Passing fields from (html-JavaScript) table to JavaScript Function
Replies
0
Views
251
lexer
lexer
JScannell
  • Locked
  • Question
Programmatically inserting a newline in a &lt;textarea&gt;, &lt;span&gt;, or &lt;div&gt;
Replies
5
Views
561
ggriffit
ggriffit
Kennelbloke
  • Locked
  • Question
Can't Get Markers to show on Map
Replies
0
Views
299
Kennelbloke
Kennelbloke
Rayj0000
  • Locked
  • Question
How to disable an html button for subsequent website visitors?
Replies
0
Views
208
Rayj0000
Rayj0000
JScannell
  • Locked
  • Question
Google Chrome doesn't load my javascript files
Replies
1
Views
207
JScannell
JScannell

Part and Inventory Search

Sponsor

Back
Top