I have a script I am using that will change a link from a regular link to a mailto link. The idea is most bad robots will not parse javascript thus is a bit better than putting the email address as is or spacing and spelling the # symbol.
The HTML should render as:
Contact our Sales Manager by email.
The word email would be a link to the email. However with the JS code it renders as so:
Contact our Sales Manager by email#email.com.
I would like the first sentence to be how the page renders.
Here is the code:
HTML:
<p>Contact our Sales Manager by
<a class="email" title="email/email.com" href=" ">email</a>.
</p>
JS:
$(function() {
$('a.email').each(function(){
var e = this.title.replace('/','#');
$(this).text().replace('/','#');
this.href=" ";
this.href = 'mailto:' + e; $(this).text(e);
});
});
How would I modify the script to leave the word email in there but create the link correctly?
Here is a working example: http://jsfiddle.net/smLQ7/
To fix this, simply remove one part of the JavaScript so it is like this:
$(document).ready(function() {
$('a.email').each(function(){
var e = this.title.replace('/','#');
$(this).text().replace('/','#');
this.href=" ";
this.href = 'mailto:' + e;
});
});
We have removed this code:
$(this).text(e);
It was responsible for replacing email with email#email.com in the page contents.
If you're going to do it via JS then why bother putting the address in the tag at all?
Why not just try something like this on (document).ready()
var theaddress ="mailto:email#email.com"
$('a.email').attr('href',theaddress);
EDIT:
Working here: http://jsfiddle.net/sMnrR/
Replace
$(this).text(e)
by
$(this).text('email');
text('some string') replaces the content of the element by its argument. So in your case, the link's content was being replaced by the email address.
If understand your problem, Here is solution:
$(function() {
$('a.email').each(function(){
var e = this.title.replace('/','#');
$(this)
.attr('href','mailto:' + e)
.text(e.substr(0,e.indexOf("#")));
});
});
Take a look at jsfiddle
Related
I am a bit confused, because I just want to add a hash to an existing url via varibale and open it via a href.
Example:
$( ".MyLink" ).each( function(){
var href = $(this).attr('href');
$(this).attr("href", "https://website.com/subpage#" + href);
});
Result (browser url) after clicking on this link:
https://website.com/subpage/#test
If I am right, a correct hash link should look like this ...
https://website.com/subpage#test
... without the "/" after subpage.
So, I am correct or it doesn't matter? If yes, how can I change it?
I also realized that my browser(s) change my url from https://website.com/subpage#test to https://website.com/subpage/#test if I just add it in the browser bar and press enter. Is that new?
Maybe it is important to know that I use wordpress?
OK, it seemes to be a php/browser/wordpress rule that # become /#, because this script creates an endless refresh-loop for me:
var urlupdate = window.location.href.replace("/#", "#");
window.location.href = urlupdate;
Update: As described in this answer, it shouldn't make a difference if your Javascript was written properly, it seems to be even considered as a best practice. If you want to get rid of it anyways you may want to check your wordpress settings, maybe the second answer of the given question may give you a hint!
In case that the trailing slash comes from the a tag, you could check whether the string in the href attribute starts with a slash and remove it then:
$( ".MyLink" ).each( function(){
var href = $(this).attr('href');
if (href.charAt(0) === '/') {
href = href.substring(1, href.length);
}
$(this).attr("href", "https://website.com/subpage#" + href);
});
I'm working with Google Sites right now. I've added an HTML Box to my page and added my script. What the script should do is, that when I click on a text, that this text changes its displaytext and adds an href to it. The text is in a table in a "td" with the class "hey". My first function was this
function showitnow() {
var div_data = "<br> <br> <a href='https://www.google.com'>Test</a>";
$(".hey").html(div_data);
}
$(".hey").click(function() {
showitnow();
});
I've copied this function from here. When I click on the field with the class "hey", it only changes my text to "Test". The site knows, that "Test" is a link, but the href went missing, so nothings happens when you click on it. After that I've tried to use the setAttribute and setProperties functions, that were mentioned here on the forum, but they also didn't work. I've noticed, on some versions of Jquery, that when I click on the text, the Firebug console says "Rejecting .setAttribute".
My Question is, are these functions forbidden on Google Sites or is there another way to add a Link and change the display text?
I'm using Version 1.10.1 of Jquery.
try this
$(".hey").click(function() {
var div_data = "<br> <br> <a href='https://www.google.com'>Test</a>";
$(this).append(div_data );
});
Try this:
$(document).ready(function(){
$(".hey").click(function() {
var div_data = '<br> <br> Test';
$(".hey").html(div_data);
});
})
JSFIDDLE DEMO
I need to pass a couple bits of info through the URL just by clicking a link, rather than by using action="GET" with a form and input button. Is this possible? This is client-side only, there is no server, so suggestions regarding PHP etc. will not be useful in this circumstance.
In your anchor, change the href to include a querystring at the end.
e.g.
<a href="http://www.example.com/test.html?parameter=2">
Assuming you have access to the variables on the client, you can do something like this:
<script type="text/javascript">
navigateToPage = function(val){
window.location.href = "/somefolder/somefile.htm?id=" + val;
}
</script>
<input type="button" value="Navigate" onclick="navigateToPage(5);" />
You're gonna need to use JavaScript to get all the values, and then combine them into a URL.
Here's an example (using the jQuery library):
Click
<script>
$(function(){
// The data, from the page
var id = 1, name = 'test';
// Add event to link
$('#paramLink').click(function(e){
e.preventDefault(); // Stop the browser from following the link
location.href = $(this).attr('href')+'?id='+id+'&name='+name; // Build the URL
});
});
</script>
put your bit of info in anchor and post along with it
click!
how to get these values on redirected page; and in case you using PHP.
$id=intval($_REQUEST['id']);
$action=$_REQUEST['action'];
My brain is fried ATM and I have a looming deadline, I am looking for a way to grab the currently viewed pages url and place it into another link for bookmarking/social links.
Facebook link:http://www.facebook.com/share.php?u=[PAGEURL]
Myspace link:http://www.myspace.com/Modules/PostTo/Pages/?u=[PAGEURL]
Twitter link: http://twitter.com/home?status=Check+this+out:+[PAGEURL]
Stumble Upon link:http://www.stumbleupon.com/submit?url=[PAGEURL]
Digg link: http://digg.com/submit?phase=2&url=[PAGEURL]
I need to replace [PAGEURL] with the URL for the page being viewed. Any help is most appreciate. i have been looking for a while now and can't seems to find an answer that fits this specific circumstance.
It'd help to see what kind of structure those links are in. But, here's some jQuery that might point you in a good direction. It assumes your social bookmarking links are in a container with id="socials", but you can mash the selector to do whatever it takes to get hold of your social links.
$(function() {
var links = $('#socials a'),
matchExp = /\[PAGEURL\]/,
currentURL = location.href;
links.each(function() {
var currentHREF = $(this).attr('href');
if (currentHREF.match(matchExp)) {
$(this).attr('href',currentHREF.replace(matchExp,currentURL));
}
});
});
This uses the attr function to get where the link points to, then a regular expression (eww!) to check if the link has [PAGEURL] in it, and to replace [PAGEURL] with location.href, which is the url of the current page. Here's a handy regexp tester.
window.location.href should work.
I imagine it would be something like
var faceBookUrl = "http://www.facebook.com/share.php?u=" + location.href
I have tried finding a simialr example and using that to answer my problem, but I can't seem to get it to work, so apologies if this sounds similar to other problems.
Basically, I am using Terminal Four's Site Manager CMS system to build my websites. This tool allows you to generate navigation elements to use through out your site.
I need to add a custom bit of JS to append to these links an anchor.
The links generated are similar to this:
<ul id="tab-menu">
<li>test link, can i rewrite and add an anchor!!!</li>
</ul>
I can edit the css properties of the link, but I can't figure out how to add an anchor.
The JQuery I am using is as follows:
<script type="text/javascript" src="http://jquery.com/src/jquery-latest.pack.js"></script>
<script type="text/javascript">
$(document).ready(function(){
// everything goes here
$("#tab-menu").children("li").each(function() {
$(this).children("a").css({color:"red"});
});
});
</script>
Thanks in advance for any help.
Paddy
sort of duplicate of this:
How to change the href for a hyperlink using jQuery
just copy the old href and add anchor to it and paste that back
var link = $(this).children("a").attr("href");
$(this).children("a").attr("href", link+ "your own stuff");
A nice jQuery-based method is to use the .get(index) method to access the raw DOM element within your each() function. This then gives you access to the JavaScript link object, which has a property called 'hash' that represents the anchor part of a url. So amending your code slightly:
<script type="text/javascript">
$(document).ready(function(){
// everything goes here
$("#tab-menu").children("li").children("a").each(function() {
$(this).css({color:"red"}).get(0).hash = "boom";
});
});
Would change all the links in "#tab_menu li" to red, and attach "#boom" to the end.
Hope this helps!
I can now target the html by using the following:
$(this).children("a").html("it works");
I assumed that:
$(this).children("a").href("something");
would edit the href but I am wrong.
Paddy
I am not sure for the answer, I dint try
$("#tab-menu").children("li").children("a").each(function() {
// $(this).css({color:"red"}).get(0).hash = "boom";
var temp_url = $(this).href +'#an_anchor';//or var temp_url = $(this).attr('href');
$(this).attr('href', temp_url);
});