How do I use javascript to replace hash tags with links from a jquery data-attribute

12,582

Solution 1

If you code in your question is posted exactly as you use it, you need to assign the result of the caption.replace(). Just calling .replace() won't change caption.

Assuming all you are doing is this:

caption.replace(/#(\S*)/g,'<a href="http://twitter.com/#!/search/$1">$1</a>');

Try using it like this:

caption = caption.replace(/#(\S*)/g,'<a href="http://twitter.com/#!/search/$1">$1</a>');

As per documentation for Replace:

Returns a new string with some or all matches of a pattern replaced by a replacement. The pattern can be a string or a RegExp, and the replacement can be a string or a function to be called for each match.

Off course, if you already have been doing it and you simply didn't post that than the issue is something else.

Let me know if that is the case and I will remove my answer as it then obviously does not apply.

Solution 2

I would go for /#(\S+)/g to avoid the single #

Share:
12,582

Related videos on Youtube

Brian
Author by

Brian

Updated on September 15, 2022

Comments

  • Brian
    Brian over 1 year

    I'm effectively trying to do the same as in this question Change #hash tag to link on page load But I think because I'm getting the string from a jquery objects data-caption attribute something isn't working correctly. I have a DOM element like this

    <a class="thumbnail" rel="gallery" data-caption="#drink from somewhere #fun" data-pid="36" href="http://domain.com/something"><img src="http://domain.com/somephoto.png" alt="acee7bd0d8339b9ddcf4a259ec7ddeec"></a>
    

    It's basically a thumbnail that is loaded into a modal then i'm trying to grab the attribute caption and create links out of any hash tags

     var caption = anchor.attr('data-caption') ? anchor.attr('data-caption') : null;
     console.log(caption);
    

    where the variable anchor is a jquery object representative of the link

    I can see there is a caption if i check the log it prints "#drink from somewhere #fun"

    So now throwing that in a regex replace fn

    caption.replace(/#(\S*)/g,'<a href="http://twitter.com/#!/search/$1">$1</a>');
    

    Then append the caption to the DOM with the links active.

    But nothing happens to the caption string I just get the same thing out that I put in.

    **EDIT ANSWER dumb mistake forgot to assign the return value to a variable

    var captionLinks = caption.replace(/#(\S*)/g,'<a href="http://twitter.com/#!/search/$1">$1</a>');
    
    • Nope
      Nope over 11 years
      Just double checking, you are doing caption = caption.replace(...), not just caption.replace(...)?