To start, I am a complete beginner to Javascript and any language for that matter. I am using wordpress for my website.
I have a website that has images loaded according to a query string.
Ex.
www.mysite.com/page1 no image
www.mysite.com/page1?sponsor=calbest logo of calbest
www.mysite.com/page1?sponsor=pfcu logo of pfcu
My question is: how can I keep the current query string even when visiting other pages?
For example, I start off at www.mysite.com/page1?sponsor=calbest and want to click a link to another page. How can I ensure that I arrive at www.mysite.com/page2?sponsor=calbest without having to write it directly in HTML?
The reason I need this is so that I can update page1 or others and add various sponsors to the pages so they have a "personalized" webpage.
Is there a Javascript function that could just add the query string in use to any link I click?
This is a "Jquery" way to do it:
<html>
<head>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.3.js'></script>
<script type='text/javascript'>
$(function(){
getParameterByName = function(name) {
name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
var sponsor = getParameterByName('sponsor') || 'calbest';
$('a.sponsor').each(function( index ) {
$(this).attr("href", $(this).attr("href")+ "?sponsor="+ sponsor);
});
});
</script>
</head>
<body>
<a class="sponsor" href="http://www.google.com">Google</a>
<a class="sponsor" href="http://www.yahoo.com">Yahoo</a>
<a class="sponsor" href="http://stackoverflow.com">Stackoverflow</a>
MS Not Sponsored
</body>
</html>
Not forgetting where I got the getParameterByName
Related
with a url of http://example.com?productName=Walkman is working right
<body>
<h1 id="productName"></h1>
</body>
<script type='text/javascript'>
// start by creating a function
function loadUp(){
var str = window.location.search.replace(/(?:(\D+=))/ig, "") //get the search parameters from the url and remove everything before the "=" sign
document.getElementById('productName').innerHTML = str //assign that string to the "innerHTML" of the h1 tag that has an id of "productName"
};
window.onload = loadUp; // once the page has loaded, fire off that function
</script>
the problem is that if i add 2 or more words in the URL
http://example.com?productName=Best_Walkman
on the page i have Best_Walkman but i want to show Best Walkman
how can i hide this symbol on th website _ ? inide the tag
<h1 id="productName"></h1>
just add another replace
str = window.location.search.replace(/(?:(\D+=))/ig, "").replace("_"," ")
edit
for all _ to be replaced, you need to replace using regex
replace(/(?:(\D+=))/ig, "").replace(/_/g," ")
str = window.location.search.replace(/(?:(\D+=))/ig, "").replace("_"," ").replace("_"," ").replace("_"," ").replace("_"," ").replace("_"," ")
This is my solution so far, if you have something better, please post it.
so I am trying to change a value of a parameter using JS or jQuery. I have a url that looks like this:
www.exampleurl.com/somepage?foo=test
I already have the code for getting the value coming after foo which is:
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, '\\$&');
var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, ' '));
}
var foo = getParameterByName('foo');
I now have a page where the HTML-Code looks like this:
<div class="bonus-button">
<script language="javascript" type="text/javascript" src="https://t.tellja.eu/widget/button/PSIGn2?skin=194&t_mc=kwk&btn=rec_somecompany"></script>
</div>
What I want to do is replace t_mc=kwk with t_mc=value.of.foo. In this example it would mean
<div class="bonus-button">
<script language="javascript" type="text/javascript" src="https://t.tellja.eu/widget/button/PSIGn2?skin=194&t_mc=test&btn=rec_somecompany"></script>
</div>
So far I have not found something I could really use or that works. Do you guys have any suggestions what I could use, e.g. replace didn't work.
Use document.querySelector to get the script tag and using getAttribute get the src from the script. In the string obtained using split and join replace the value and set the src again using setAttribute
var a = document.querySelector('.bonus-button > script').getAttribute('src')
document.querySelector('div > script').setAttribute('src', a.split('t_mc=kwk').join('t_mc=value.of.foo'))
<div class="bonus-button">
<script language="javascript" type="text/javascript" src="https://t.tellja.eu/widget/button/PSIGn2?skin=194&t_mc=kwk&btn=rec_somecompany"></script>
</div>
I try to use a script for prefilter ISOTOPE from an other page, but my Isotope script doesn't load my value with the filter value.
You can test by yourself here : http://aprime-industries.com/
Just click on "Nos Références" and click on ENTI for exemple.
You will see my dropdown list is "ENTI" selected but the filter is not active, I need to click on "Indifférent" and click again on ENTI for activate the filter and the data-filter-value.
<option value="ENTI" data-filter-value=".ENTI">ENTI</option>
I will give you my script for link the value from the dropdown list :
function getParameterByName(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
And
$(document).ready(function(){
var preSelected = getParameterByName("filter");
if(preSelected == "ENTI") {
$('select[name="societe"]').val("ENTI");
}
else if(preSelected == "S2MI") {
$('select[name="societe"]').val("S2MI");
}
else if(preSelected == "JBM41") {
$('select[name="societe"]').val("JBM41");
}
});
And my href link :
<img src="img/entilogo.png" class="" alt="icone ENTI">
<img src="img/s2milogo.png" class="" alt="icone S2MI">
<img src="img/jbm41logo.png" class="" alt="icone JBM41">
I make a jsfiddle for my isotope script JSFIDDLE
Bump ! my deadline is tomorrow :(
it is loading too late because it is inside $(document).ready(function(){}. Window will load first and then the code inside $(document).ready(function(){} will be executed.
So loose $(document).ready(function(){} and keep the script in header to load it before body part loads.
But it is highly recommended to keep the scripts in footer and inside $(document).ready(function(){} since it will load the script at the end of window load and load your html elements faster.
If I write code in the JavaScript console of Chrome, I can retrieve the whole HTML source code by entering:
var a = document.body.InnerHTML; alert(a);
For fb_dtsg on Facebook, I can easily extract it by writing:
var fb_dtsg = document.getElementsByName('fb_dtsg')[0].value;
Now, I am trying to extract the code "h=AfJSxEzzdTSrz-pS" from the Facebook Page. The h value is especially useful for Facebook reporting.
How can I get the h value for reporting? I don't know what the h value is; the h value is totally different when you communicate with different users. Without that h correct value, you can not report. Actually, the h value is AfXXXXXXXXXXX (11 character values after 'Af'), that is what I know.
Do you have any ideas for getting the value or any function to generate on Facebook page.
The Facebook Source snippet is below, you can view source on facebook profile, and search h=Af, you will get the value:
<code class="hidden_elem" id="ukftg4w44">
<!-- <div class="mtm mlm">
...
....
<span class="itemLabel fsm">Unfriend...</span></a></li>
<li class="uiMenuItem" data-label="Report/Block...">
<a class="itemAnchor" role="menuitem" tabindex="-1" href="/ajax/report/social.php?content_type=0&cid=1352686914&rid=1352686914&ref=http%3A%2F%2Fwww.facebook.com%2 F%3Fq&h=AfjSxEzzdTSrz-pS&from_gear=timeline" rel="dialog">
<span class="itemLabel fsm">Report/Block...</span></a></li></ul></div>
...
....
</div> -->
</code>
Please guide me. How can extract the value exactly?
I tried with following code, but the comment block prevent me to extract the code. How can extract the value which is inside comment block?
var a = document.getElementsByClassName('hidden_elem')[3].innerHTML;alert(a);
Here's my first attempt, assuming you aren't afraid of a little jQuery:
// http://stackoverflow.com/a/5158301/74757
function getParameterByName(name, path) {
var match = RegExp('[?&]' + name + '=([^&]*)').exec(path);
return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}
var html = $('.hidden_elem')[0].innerHTML.replace('<!--', '').replace('-->', '');
var href = $(html).find('.itemAnchor').attr('href');
var fbId = getParameterByName('h', href); // fbId = AfjSxEzzdTSrz-pS
Working Demo
EDIT: A way without jQuery:
// http://stackoverflow.com/a/5158301/74757
function getParameterByName(name, path) {
var match = RegExp('[?&]' + name + '=([^&]*)').exec(path);
return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}
var hiddenElHtml = document.getElementsByClassName('hidden_elem')[0]
.innerHTML.replace('<!--', '').replace('-->', '');
var divObj = document.createElement('div');
divObj.innerHTML = hiddenElHtml;
var itemAnchor = divObj.getElementsByClassName('itemAnchor')[0];
var href = itemAnchor.getAttribute('href');
var fbId = getParameterByName('h', href);
Working Demo
I'd really like to offer a different solution for "uncommenting" the HTML, but I stink at regex :)
I'm building an advert delivery method and am try to do it through an external Javascript/jQuery page.
I have this so far, but I have some issues with it
$.get('http://url.com/ad.php', {
f_id: _f_id,
f_height: _f_height,
veloxads_width: _f_width
}, function (result) {
var parts = result.split(",");
var path = parts[0],
url = parts[1];
document.write('<img src="' + path + '">');
I can see the page load, but then after the code above is loaded, it creates a new page with just the advert on it. Is there anyway I can write it onto the page where the code was put?
And this is the script web masters put on their websites to include the adverts:
<script type="text/javascript">
var _f_id = "VA-SQ2TDEXO78N0";
var _f_width = 728;
var _f_height = 90;
</script>
<script type="text/javascript" src="http://website.com/cdn/addelivery.js"></script>
Cheers
is ad.php on the same domain as your script? if it's not have a look at this article
here is a code you could use in your html page, where you want the ad to be inserted:
$.get('http://url.com/ad.php',
{ f_id : _f_id, f_height : _f_height, veloxads_width : _f_width }
).success(function(result) {
var parts = result.split(",");
var path = parts[0], url = parts[1];
$('body').prepend('<div id="ad_id"><img src="'+path+'"></div>');
});
the selector (body here) can be an id, a class, ... (see documentation). You can also use prepend() or html() instead of append, to insert the code where you want ;)