如何<a>使用圖像標簽</a>解析<a>字符串中</a>的<a>href</a>

Question

 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;
        }

好的，所以我有這個功能。 其目的是解析字符串中的鏈接，並放置漂亮的包裝以供人為點擊。 在這方面，它很棒。

我的問題是當我在字符串中有這樣的圖像時

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

它像這樣解析

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

當然，我也不希望出現這種語法恐怖。 請幫忙！ :(

Answer 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標記內的url。