• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 226
  • Last Modified:

display new page after image is loaded

I've followed this example from Tech Republic.  However, I need to know how to assign a more complicated anchor tag to the document.location.href object.

Instead of index2.html, as shown in the example below, I have the following anchor tag:
<a href='<%=formattedURL.toString()%>' target='_blank'><img align="center" border="0" src="<render:getSkinPath imageName="button.gif"/>"/></a>&nbsp;

How do I assign all of this to the document object?

<html>
 
<head>
 
<script language="JavaScript">
 
 
 
// create an image object
 
objImage = new Image();
     
 
// set what happens once the image has loaded objImage.onLoad=imagesLoaded();
     
 
// preload the image file
 
objImage.src='images/image1n.gif';
 
 
 
// function invoked on image load
 
function imagesLoaded()
 
{    
     document.location.href='index2.html';
 
}
 
 
 
</script>
 
</head>

Open in new window

0
newbieal
Asked:
newbieal
  • 5
  • 3
  • 3
3 Solutions
 
Ronb23Commented:
If I understand this correctly, you're looking to pass a different URL into your function.

Try this in your JavaScript function:

function imagesLoaded()
{
      var myURL = '<%=formattedURL.toString()%>';
      document.location.href='myURL';
}

and you href tag would look something like this:
<a href="#" onClick="javascript:imagesLoaded();" target='_blank'><img align="center" border="0" src="<render:getSkinPath imageName="button.gif"/>"/></a>

hope this helps.
0
 
newbiealAuthor Commented:
Looks good, but when I implement this code, instead of opening up a new window with it pointing to myURL, it just opens up a new window with the previous screen.  I'm thinking it's the href="#" part.
shouldn't it be href="myURL"?
0
 
Ronb23Commented:
document.location.href is a control for the current window you're in. Also, if you placed "myURL" in the href="#", that defeats the purpose of assigning the javascript funtion with the url. You could also try this:

function imagesLoaded()
{
      var myURL = '<%=formattedURL.toString()%>';
      window.open='myURL';
}

<a href="#" onclick="imagesLoaded();return false;">><img align="center" border="0" src="<render:getSkinPath imageName="button.gif"/>"/></a>
0
Cloud Class® Course: SQL Server Core 2016

This course will introduce you to SQL Server Core 2016, as well as teach you about SSMS, data tools, installation, server configuration, using Management Studio, and writing and executing queries.

 
newbiealAuthor Commented:
i would like to open a new window though.  How do i do this?
0
 
Ronb23Commented:
What i posted above opens a new window.
0
 
b0lsc0ttIT ManagerCommented:
To open a new window you need to use ...
function imagesLoaded() {
    var myUrl = '<%=formattedURL.toString()%>';
    window.open(myUrl, 'newWindow');
}
Window.open doesn't use an equal sign.  Let me know if there is a question.
bol
0
 
b0lsc0ttIT ManagerCommented:
Take a look at the html source (i.e. in the browser choose the View Source option) to see how  the resulting html looks.  It seems you may end up with extra > characters.  Post that code if you have a question or still have a problem getting this to work.
bol
0
 
Ronb23Commented:
oops sorry, pasted the wrong one:

function imagesLoaded()
{
      var myURL = '<%=formattedURL.toString()%>';
      window.open(myURL)';
}

<a href="#" onclick="imagesLoaded();return false;">><img align="center" border="0" src="<render:getSkinPath imageName="button.gif"/>"/></a>
0
 
b0lsc0ttIT ManagerCommented:
>>       window.open(myURL)'; <<

You need to include the second parameter when using window.open.  It is for the "name" of the window and is not optional.  Leaving it off might work in some browsers but will fail and it should not be omitted.
bol
p.s.  There is also a typo in that line
0
 
Ronb23Commented:
Having a sloppy day. It's the Friday syndrome...

function imagesLoaded()
{
      var myURL = '<%=formattedURL.toString()%>';
      window.open(myURL, 'newwin');
}

<a href="#" onclick="imagesLoaded();return false;">
<img align="center" border="0" src="<render:getSkinPath imageName='button.gif'/>"/>
</a>
0
 
newbiealAuthor Commented:
worked, thanks much!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: Certified Penetration Testing

This CPTE Certified Penetration Testing Engineer course covers everything you need to know about becoming a Certified Penetration Testing Engineer. Career Path: Professional roles include Ethical Hackers, Security Consultants, System Administrators, and Chief Security Officers.

  • 5
  • 3
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now