文本中的url替換成能夠點擊的link地址

$(function(){
  content="<br>將一個用戶輸入的一段文本中的url替換成能夠點擊的link地址。<br>"
    +"<br>測試一下:(lp-p.rrrr.com緊接着還有me.ttt-tt.com)"
    +"<br>測試一下:http://www.ablanxue.com緊接着還有http://www.baidu.com"
    +"<br>測試一下複雜網址:https://zhidao.baidu.com/question/263160181132274005.html"
    +"<br>測試一下複雜網址:http://blog.csdn.net/zcjlike/article/details/71169803"
    +"<br><br>測試一下複雜網址:https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&tn=baidu&wd=%E4%B8%80%E6%AE%B5%E7%AE%80%E5%8D%95%E7%9A%84JS%E5%8F%AF%E4%BB%A5%E5%B0%86%E6%99%AE%E9%80%9A%E7%9A%84%E6%96%87%E6%9C%AC%E9%93%BE%E6%8E%A5URL%E8%BD%AC%E6%8D%A2%E6%88%90%E5%8F%AF%E7%82%B9%E5%87%BB%E7%9A%84%E8%B6%85%E9%93%BE%E6%8E%A5&oq=js%25E8%258E%25B7%25E5%258F%2596%25E6%2596%2587%25E6%259C%25AC%25E4%25B8%25AD%25E7%259A%2584url%25E9%2593%25BE%25E6%258E%25A5%252C%25E5%25B9%25B6%25E6%259B%25BF%25E6%258D%25A2a%25E6%25A0%2587%25E7%25AD%25BE&rsv_pq=a02d33130004abcc&rsv_t=4f4evz2vRTr3VcQfoLBEDiKs%2B8k334%2Fh8Ir5bG2ZDcpkmdabKM8mMEuz5qc&rqlang=cn&rsv_enter=0&inputT=1008&rsv_sug3=142&rsv_sug1=47&rsv_sug7=000&rsv_n=2&bs=js%E8%8E%B7%E5%8F%96%E6%96%87%E6%9C%AC%E4%B8%AD%E7%9A%84url%E9%93%BE%E6%8E%A5%2C%E5%B9%B6%E6%9B%BF%E6%8D%A2a%E6%A0%87%E7%AD%BE"
    +"<br><br>測試一下複雜網址:https://c.runoob.com/front-end/854"
    +"<br>測試一下:[RR^R](lp-p.rrrr.com)緊接着還有[TTTTT](me.ttt-tt.com)"
    +"<br>測試一下:[X&UE](http://www.ablanxue.com)緊接着還有[百度](http://www.baidu.com)"
    +"<br>測試一下複雜網址:[複雜'網址1](https://zhidao.baidu.com/question/263160181132274005.html)"
    +"<br>測試一下複雜網址:[複雜;網址2](http://blog.csdn.net/zcjlike/article/details/71169803)"
    +"<br><br>測試一下複雜網址:[複雜網?址3](https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&tn=baidu&wd=%E4%B8%80%E6%AE%B5%E7%AE%80%E5%8D%95%E7%9A%84JS%E5%8F%AF%E4%BB%A5%E5%B0%86%E6%99%AE%E9%80%9A%E7%9A%84%E6%96%87%E6%9C%AC%E9%93%BE%E6%8E%A5URL%E8%BD%AC%E6%8D%A2%E6%88%90%E5%8F%AF%E7%82%B9%E5%87%BB%E7%9A%84%E8%B6%85%E9%93%BE%E6%8E%A5&oq=js%25E8%258E%25B7%25E5%258F%2596%25E6%2596%2587%25E6%259C%25AC%25E4%25B8%25AD%25E7%259A%2584url%25E9%2593%25BE%25E6%258E%25A5%252C%25E5%25B9%25B6%25E6%259B%25BF%25E6%258D%25A2a%25E6%25A0%2587%25E7%25AD%25BE&rsv_pq=a02d33130004abcc&rsv_t=4f4evz2vRTr3VcQfoLBEDiKs%2B8k334%2Fh8Ir5bG2ZDcpkmdabKM8mMEuz5qc&rqlang=cn&rsv_enter=0&inputT=1008&rsv_sug3=142&rsv_sug1=47&rsv_sug7=000&rsv_n=2&bs=js%E8%8E%B7%E5%8F%96%E6%96%87%E6%9C%AC%E4%B8%AD%E7%9A%84url%E9%93%BE%E6%8E%A5%2C%E5%B9%B6%E6%9B%BF%E6%8D%A2a%E6%A0%87%E7%AD%BE)"
    +"<br><br>測試一下複雜網址:[複雜網$址4](https://c.runoob.com/front-end/854)";

  var regExp1 = /((http|https|ftp|mms|rtsp):\/\/)?((([\w-]+\.)+[\w-]+)(\/[\w-./?%&=]*)?)/g;//僅匹配網址url
  var regExp2 = /\[([\u4E00-\u9FA5A-Za-z0-9_^%&',;=?$]+)\]\((((http|https|ftp|mms|rtsp):\/\/)?((([\w-]+\.)+[\w-]+)(\/[\w-./?%&=]*)?))\)/g;//匹配[name](url)格式的網址,name能夠是中英文及多種字符
  var regExp3 = /(\[([\u4E00-\u9FA5A-Za-z0-9_^%&',;=?$]+)\]\()?(((http|https|ftp|mms|rtsp):\/\/)?((([\w-]+\.)+[\w-]+)(\/[\w-./?%&=]*)?))(\))?/g;//匹配單獨網址url和[name](url)格式的網址
  
  content1 = content.replace(regExp1, function($1,$2,$3,$4,$5,$6,$7){//缺點:當爲url)格式時也會被匹配,並輸出url
    //$1是url的完整匹配結果(能夠含有https://等網絡協議名)
    //$2是https://等網絡協議名的匹配結果
    //$3是https等網絡協議名的匹配結果
    //$4是url的完整匹配結果
    //$5是url的域名的匹配結果
    //$6是url的域名的第一個.號(含)前的域名匹配結果
    //$7是url的域名右側部分的匹配結果
    return "<a href='" + $1 + "' target='_blank'>" + $4 + "</a>";
  });
  content2 = content.replace(regExp2, function($1,$2,$3,$4,$5,$6,$7,$8,$9){//缺點:當爲url)格式時也會被匹配,並輸出url
    //$1是完整匹配結果
    //$2是name的匹配結果
    //$3是url的匹配結果(能夠含有https://等網絡協議名)
    //$4是https://等網絡協議名的匹配結果
    //$5是https等網絡協議名的匹配結果
    //$6是url的匹配結果
    //$7是url的域名的匹配結果
    //$8是url的域名的第一個.號(含)前的域名匹配結果
    //$9是url的域名右側部分的匹配結果
    if(typeof $2=='undefined')
      return "<a href='" + $3 + "' target='_blank'>" + $4 + "</a>";
    return "<a href='" + $3 + "' target='_blank'>" + $2 + "</a>";
  });
  content3 = content.replace(regExp3, function($1,$2,$3,$4,$5,$6,$7,$8,$9,$10){//缺點:當爲url)格式時也會被匹配,並輸出url
    //$1是完整匹配結果
    //$2是[name](的匹配結果
    //$3是name的匹配結果
    //$4是url的匹配結果(能夠含有https://等網絡協議名)
    //$5是https://等網絡協議名的匹配結果
    //$6是https等網絡協議名的匹配結果
    //$7是url的匹配結果
    //$8是url的域名的匹配結果
    //$9是url的域名的第一個.號(含)前的域名匹配結果
    //$10是url的域名右側部分的匹配結果
    if(typeof $3=='undefined')
      return "<a href='" + $4 + "' target='_blank'>" + $4 + "</a>";
    return "<a href='" + $4 + "' target='_blank'>" + $3 + "</a>";
  });
  
  $("body").html(content1);
})
相關文章
相關標籤/搜索