Using JS to Change Link

Question

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 protected].

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?

I suggest you to read more about javascript and string manipulation — pylover
– pylover, Commented Dec 5, 2012 at 4:29

Cymen · Accepted Answer · 2012-12-05 04:24:02Z

1

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 protected] in the page contents.

answered Dec 5, 2012 at 4:24

Cymen

14.5k4 gold badges58 silver badges77 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

James · Accepted Answer · 2012-12-05 04:26:16Z

1

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 protected]"

$('a.email').attr('href',theaddress);

EDIT:

Working here: http://jsfiddle.net/sMnrR/

answered Dec 5, 2012 at 4:26

James

3,2934 gold badges43 silver badges57 bronze badges

1 Comment

L84 Over a year ago

I have thought of that but I use templates and I can stick the code in the template and then just add the class email and title to the specific email addresses. It seems convoluted I know but in my case it works better. Though I may use your example in other places. Thanks!

MD Sayem Ahmed · Accepted Answer · 2012-12-05 04:30:50Z

1

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.

edited Dec 5, 2012 at 4:30

answered Dec 5, 2012 at 4:24

MD Sayem Ahmed

29.3k27 gold badges115 silver badges183 bronze badges

Comments

pylover · Accepted Answer · 2012-12-05 04:39:23Z

0

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

answered Dec 5, 2012 at 4:39

pylover

8,1918 gold badges53 silver badges73 bronze badges

Collectives™ on Stack Overflow

Using JS to Change Link

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related