2017-05-16 7 views
1

ハッシュの#文字を持つテキストエリア内のテキストを、入力時にアンカーリンクに置き換えます。ハッシュタグをリアルタイムでアンカーリンクに置き換えます。

例えば、その実際のコードが

何か<のhref = "/タグ/#のsomethingelse" クラスは= "ハッシュタグ" > #somethingelse </> somethingelse

が、テキストエリア内だろうsomethingsomethingelse #somethingelse何か、私は思います#somethingelseを強調表示したいのは、アンカーコードを実際に持たせたくないからです。ちょうどtwitterとfbのようにします。

どのように動作しますか?あなたがする必要がどのような

$('textarea').on("keyup", function() { 
 
    var str = $(this).val(); 
 
    if (!str.match(/(http|ftp|https):\/\/[\w-]+(\.[\w-]+)+([\w.,@?^=%&amp;:\/~+#-]*[\[email protected]?^=%&amp;\/~+#-])?#([a-zA-Z0-9]+)/g)) { 
 
    if (!str.match(/#([a-zA-Z0-9_]+)#/g)) { 
 
     str = str.replace(/#([a-zA-Z0-9_]+)/g, '<a href="/tags/#$1" class="hashtag">#$1</a>'); 
 
     $('textarea').html(str) 
 
     } 
 
    } 
 
});
.hashtag { 
 
    background: #000; 
 
    color: #fff; 
 
}

+1

あなたは、単純な '