how do you insert a variable into a url - javascript

I am trying to insert a variable in a url link in javascript but it's not letting me do it, it keeps looking for a file...
here is the code:
var pic = element.src;
document.getElementById('image').style.backgroundImage='url(pic)'
question is how I can insert the variable into the url link..the pic is a link to a photo on a website.

I think the problem is that url(pic) is a string. Try string concatenation instead like:
document.getElementById('image').style.backgroundImage='url(' + pic + ')';

Try this:
document.getElementById('image').style.backgroundImage='url('+pic+')'
To concadenate variable in string, you need to use + in JavaScript.

You need to concatenate the url( and pic and )
document.getElementById('image').style.backgroundImage='url(' + pic + ')';

Related

jQuery append with variable as src

Just learning jQuery and cannot get my variable into src when I use append. It either doesn't work at all, or I just get the string representation of my variable name when I look in the console.
This is my offending code:
var $googleURL = "http://maps.googleapis.com/maps/api/streetview?size=600x300&location="+$googleStreet+","+$googleCity;
$($body).append('<img src='$googleURL'></img>');
I don't want to use attr because there is no img tag on the page, just a body tag. Where did I go astray?
please try
$($body).append("<img src='"+ $googleURL + "'></img>");
With Javascript, you can put variables inside strings using +
Like this: "string, " + variable + ", more string"
Try this code, it may work depending on what you're trying to accomplish.
var googleURL = 'http://maps.googleapis.com/maps/api/streetview?size=600x300&location='+googleStreet+','+googleCity;
$($body).append('<img src="' + googleURL + '"></img>');

jQuery create and open URL with ampersand

I'm trying to build an URL in jquery and then open it. The problem is that the URL should contain an ampersand and I can't figure out how to do that
var url = 'print?month=' + jQuery('#month').val() + '&year=' + jQuery('#year').val();
var encodedUrl = encodeURIComponent(url);
window.open(encodedUrl);
Essentially, what I'd like the URL to be is: print?month=1&year=2015
Yes, changing & a m p ; [without spaces] to & should work, if not you should probably do something like below:
var url = 'print?month=' + encodeURIComponent(jQuery('#month').val()) + '&year=' + encodeURIComponent(jQuery('#year').val());
window.open(url);
Fully working plnkr is at:http://plnkr.co/edit/70h1E8SJDXMhtMJPnKMp?p=preview
Just enable popups on your browser for plnkr if you dont see the popup yet.
Basically just create a string with concatenating & charecters, its just a string, you dont need to URIEncode it, then do a window.open of the string. That should do it.

Javascript & problems

I have the following code:
var artist = document.getElementById("txtBoxArtist").value;
When value is plain text, e.g. Biffy Clyro, artist = Biffy Clyro
When value contains &, e.g. Mumford & Sons, artist = Mumford
I the send artist value using AJAX, and recover the value on another php page like this:
var data = "nameTitle=" + title + "&nameArtist=" + artist;
[...]
$nameArtist=$_POST['nameArtist'];
Why does this happen and how to avoid it? It is giving me lots of problems this &symbol...
Thank you all!
You need to encode the values before sticking them on the URL.
var data = "nameTitle=" + encodeURIComponent(title) + "&nameArtist=" + encodeURIComponent(artist);
You should also see this.
Some characters are special and need 'escaping' to encode their values - as you are showing using & instead of &.
However, these escaping principles are different for HTML content and for URLs/URIs.
In URI, & is escaped as %26 and not as & - so you should either use that or the appropriate encoding/decoding functions, not the HTML entity encoding/decoding.
I guess you can encode valiables before sending them like this:
artist = encodeURIComponent(artist);
title = encodeURIComponent(title);
var data = "nameTitle=" + title + "&nameArtist=" + artist;
hope this helps.

How to add URL ending to "w.location.href" in JavaScript?

I'm not really bright at JavaScript, so how do I add to "w.location.href"?. I tried searching, but it's hard to formulate the right question too.
This is part of a bookmarklet for Chrome:
encodeURIComponent(w.location.href)
This will return the active URL in the broswer adress field, like http://www.domain.com. But how can I add to it so the ending will be like, "http://www.domain.com/?rcode=abc1234"?
I tried this:
encodeURIComponent(w.location.href + "?rcode=abc12345")
and
encodeURIComponent(w.location.href + ('?rcode=abc12345')
But nothing workes, OR, it droppes out the "=" in the added string.
--
Ok, I'm adding the EDITED "flipit" code here:
javascript:void((function(d,w,p,s,r,t,l)%7Bt%3D(w.screenTop%7C%7Cw.screenY)%2B50%3Bl%3D(w.screenX%7C%7Cw.screenLeft)%2B(w.innerWidth%7C%7Cd.documentElement.offsetWidth%7C%7C0)/2-s/2%3Bw.__flipboard%3Dw.open(%27https://share.flipboard.com/bookmarklet/popout%3Fv%3D2%26title%3D%27%2BencodeURIComponent(d.title)%2B%27%26url%3D%27%2BencodeURIComponent(w.location.href + "?rcode=wlb535")%2B%27%26t%3D%27%2Bp,%27__flipboard_flipit%27,%27width%3D%27%2Bs%2B%27,height%3D%27%2Br%2B%27,top%3D%27%2Bt%2B%27,left%3D%27%2Bl%2B%27,location%3Dyes,resizable%3Dyes,status%3Dno,scrollbars%3Dno,personalbar%3Dno,toolbar%3Dno,menubar%3Dno%27)%3Bs%3Dd.createElement(%27script%27)%3Bs.setAttribute(%27type%27,%27text/javascript%27)%3Bs.setAttribute(%27src%27,%27https://d2jsycj2ly2vqh.cloudfront.net/bookmarklet/js/popout-helper.min.js%3Ft%3D%27%2Bp)%3Bd.body.appendChild(s)%3BsetTimeout(function()%7Bw.__flipboard.focus()%7D,50)%3B%7D)(document,window,(new Date().getTime()),535,565))
Try this:
var url = window.location;
url = encodeURI(url + '?rcode=abc12345');
If you want to change the location programmatically, use:
window.location.href += encodeURIComponent('?rcode=abc12345');

Trying to covert a variable into its value within a URL

I'm trying to insert a variable's value into a url, but it's not working; I'm just getting the variable not the value
'myid' and 'verif' are the variables and their values are integers.
This code inserts the url into a hidden field in a form
$('#return').val(http://pegdown.com/index.php?option=com_joom_creditspack&controller=paypal&view=paypal&layout=return&task=checkout&myid=myid&packid=1&verif=verif&jcode=xxx111xxx);
How do I write the following url so the variables 'myid' and 'verif' are converted to their values?
Well you are missing quotes so your code would not work at all.
$('#return').val("http://pegdown.com/index.php?option=com_joom_creditspack&controller=paypal&view=paypal&layout=return&task=checkout&myid=" + myid + "&packid=1&verif=" + verif + "&jcode=xxx111xxx");
You should probably use encodeURIComponent()
You need to quotes " " the strings and concat the variables +
Try
$('#return').val("http://pegdown.com/index.php?option=com_joom_creditspack&controller=paypal&view=paypal&layout=return&task=checkout&myid="+myid+"&packid=1&verif="+verif+"&jcode=xxx111xxx");
JavaScript does not support string interpolation. Try something like this.
myIdVal = encodeURIComponent(myId);
verifVal = encodeURIComponent(verif);
var url = "http://pegdown.com/index.php?option=com_joom_creditspack&controller=paypal&view=paypal&layout=return&task=checkout&myid=" + myidVal + "&packid=1&verif=" + verifVal + "&jcode=xxx111xxx";
$('#return').val(url);
A simple string works for me:
given index = 2,
`a.setAttribute("href", "myDirectory/" + index + ".jpg");` links the anchor to
"myDirectory/2.jpg", ie. the file number is taken from variable index.
Not sure if the setAttribute tolerates multiple tokens in its second parameter, but generally, this works.

Categories