Hector Lamar
Hector Lamar

Reputation: 241

JS include URL as URL parameter

I have this script in JS which uses URL parameter for image location, it works fine when image is located in the same place as the script like below

<iframe src="pan.htm?image=img1.jpg" ></iframe>

But I need it to get the image from other location, how do I do it I tried the way below but it doesn't work this way (url is just an example)

<iframe src="pan.htm?image=http://someaddress.com/img1.jpg" ></iframe>

Upvotes: 0

Views: 128

Answers (2)

Joeytje50
Joeytje50

Reputation: 19122

You need to encode the url. You can do this by running this script:

prompt('Here is your completed code:',encodeURIComponent(prompt('Enter the url to encode','')));

You can try it out here: http://jsfiddle.net/zenr8/

The encoded URL that the script gives you is the thing you need to enter into the URL parameter. In your case, the iframe would look like this:

<iframe src="pan.htm?image=http%3A%2F%2Fsomeaddress.com%2Fimg1.jpg" ></iframe>

If you need to enter something in an URL parameter from a script, you should always make sure that it's properly encoded. You can do this by using encodeURIComponent. If you then need to decode it for further usage in your script, just use decodeURIComponent again. For example:

alert(encodeURIComponent('http://google.com/?hl=en&q=search'));
//alerts http%3A%2F%2Fgoogle.com%2F%3Fhl%3Den%26q%3Dsearch
alert(decodeURIComponent('http%3A%2F%2Fgoogle.com%2F%3Fhl%3Den%26q%3Dsearch'));
//alerts http://google.com/?hl=en&q=search

Upvotes: 1

miguel_ibero
miguel_ibero

Reputation: 1024

You need to urlencode the parameter.

<iframe src="pan.htm?image=http%3A%2F%2Fsomeaddress.com%2Fimg1.jpg" ></iframe>

This could be done using php for example:

<iframe src="pan.htm?image=<?php echo urlencode("http://someaddress.com/img1.jpg"); ?>" ></iframe>

Or with javascript itself:

var iframe = document.createElement("iframe");
iframe.setAttribute("src","pan.htm?image="+encodeURIComponent("http://someaddress.com/img1.jpg"));
var wrapper = document.getElementById("iframe_wrapper");
wrapper.appendChild(iframe);

Upvotes: 1

Related Questions