Convert tracking script to use JQuery by loading tracking URL when a JQuery event occurs

Question

I'm using a tracking site to get some statistics. They say I should use the code:

var trackingstring = new String("<script src=\"http://trackingsite.com/track?C=12345&source=js\" type=\"text/javascript\"></script>");
document.write(trackingstring);

However I want to trigger a particular site statistic on a JQuery event rather than on page load, so I can't use document.write.

I believe there's actually no script to run at the URL, so I tried:

var thetrackingURL = "http://trackingsite.com/track?C=12345&source=js";
$.get(thetrackingURL);

However that gives me the error:

MLHttpRequest cannot load http://trackingsite.com/track?C=12345&source=js. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://example.com' is therefore not allowed access. 

How can I trigger that URL to be loaded by a JQuery event?

• Holybreath: should be fine if run from a web server...
• Highly Irregular: @Holybreath, I got that error testing from a web server (localhost). Do you mean you think it would work if I published it to the live site?
• Holybreath: That's the problem, most of the time, you are not allowed to issue httprequest against resources, without providing proper headers, it's a security measure. host your page using nginx or something, and see what happens :)

Answer 1

Try

var script = document.createElement("script");
script.src = "http://trackingsite.com/track?C=12345&source=js";
document.body.appendChild(script);

or, utilizing jquery

$.ajaxSetup({context:document.body});
$.getScript("http://trackingsite.com/track?C=12345&source=js");

Answer 2

Please read. https://security.stackexchange.com/questions/43639/why-is-the-access-control-allow-origin-header-necessary

Host your page on some local web-server using NGINX or anything else suitable.

I'm sure if you search even stackoverflow, you will find lot's of information regarding this topic.