如何解析<a> href(s) in string with image tags

时间:2016-02-01 07:20:28

标签: javascript image replace href

 function replaceTextFunction(g){
        var replacedText,replacePattern1,replacePattern2,replacePattern3;
        replacePattern1=/(\b(https?|ftp):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/gim;
        replacedText=g.replace(replacePattern1,'<a href="$1" target="_blank">$1</a>');
        replacePattern2=/(^|[^\/])(www\.[\S]+(\b|$))/gim;
        replacedText=replacedText.replace(replacePattern2,'$1<a href="http://$2" target="_blank">$2</a>');
        replacePattern3=/(([a-zA-Z0-9\-\_\.])+@[a-zA-Z\_]+?(\.[a-zA-Z]{2,6})+)/gim;replacedText=replacedText.replace(replacePattern3,'<a href="mailto:$1">$1</a>');
        return replacedText;
        }

ok so i have me this function. Its purpose is to parse links in strings and put pretty wrappers for human clicking. It works great in that regard.

My problem is when I have an image in the string like this

<img src="http://yada.yada/image.jpg">

it parses like this

<img src="<a href="http://yada.yada/image.jpg" target="_blank">">

and of course I do not want that syntax horror to occur. Please help! :(

1 个答案:

答案 0 :(得分:1)

试试这个:

function replaceTextFunction(g){
        var replacedText,replacePattern1,replacePattern2,replacePattern3;
        replacePattern1=/(\b(https?|ftp):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])(?![^<]+>)/gim;
        replacedText=g.replace(replacePattern1,'<a href="$1" target="_blank">$1</a>');
        replacePattern2=/(^|[^\/])(www\.[\S]+(\b|$))(?![^<]+>)/gim;
        replacedText=replacedText.replace(replacePattern2,'$1<a href="http://$2" target="_blank">$2</a>');
        replacePattern3=/(([a-zA-Z0-9\-\_\.])+@[a-zA-Z\_]+?(\.[a-zA-Z]{2,6})+)(?![^<]+>)/gim;replacedText=replacedText.replace(replacePattern3,'<a href="mailto:$1">$1</a>');
        return replacedText;
        }

我在正则表达式中添加了一个负向前瞻,这使得正则表达式忽略HTML标记内的网址。