UBB代码对于经常上论坛的朋友来说是最熟悉不过了。这里我不多说了，关于怎么实现UBB转换，不了解的朋友请看这里正则表达式在ＵＢＢ论坛中的应用。

    经典论坛的UBB转换我觉得是处理的非常好的，研究了一下它的转换结果[因为没有源码:)]，做了下面的演示。转换结果基本上觉得象了。

    主要是针对[code][html]这两个标签的处理，的UBB标签还是一般的处理方法。

    下面是分别用javascript和vbscript实现的演示。自己做论坛的朋友，如果想实现类似经典论坛的运行代码框可以看看这种转换。

欢迎大家输入尽量多格式的UBB进行测试，多多指出错误。

javascript:

运行代码框
<style>.CodeSamp { PADDING-RIGHT: 0.5em; MARGIN-TOP: 1em; PADDING-LEFT: 0.5em; FONT-SIZE: 8p; MARGIN-BOTTOM: 1em; PADDING-BOTTOM: 0.5em; MARGIN-LEFT: 0pt; PADDING-TOP: 0.5em; FONT-FAMILY: "Courier New"; BACKGROUND-COLOR: #eeeeee;width: 480px;overflow:hidden;border: 1px solid #888888;}textarea {border-width: 1; border-color: #000000;font-size: 12px;FONT-FAMILY: "Tahoma", "MS Shell Dlg";}</style><TEXTAREA name=phx cols=65 rows=12><I><B><FONT COLOR=blue>blue</FONT></B></I>[html][color=red]test[/color][/html][html][code]test[/code][/html][code][html]test[/html][/code]</textarea><br><button onclick=show.innerHTML=UBBCode(phx.value,"html")>转换</button><br><div id=show style="border:1 solid skyblue;width=500;font-size: 12px;FONT-FAMILY: 'Tahoma', 'MS Shell Dlg';"></div><script>strIcons = "1" //允许笑脸转换strSmile="1" //同上ImgName="em"picurl="pic/"function UBBCode(content,html){st=new Date().getTime()content=content.replace(/\[(\/)?phx_code\]/ig,"{$1phx_code}");content=content.replace(/\[(\/)?phx_html\]/ig,"{$1phx_html}");content="[phx_code]"+content+"[/phx_code]"; content=content.replace(/(\[code\]([\s\S]+?)\[\/code\])/ig,"[/phx_code]$1[phx_code]");content=content.replace(/\[phx_code\]([\s\S]*?)\[\/phx_code\]/ig,function($1,$2){if(html=="html"){return(HTMLCode($2));}else{return(trans($2));}});content=content.replace(/\[code\](\r\n)?([\s\S]+?)\[\/code\]/ig,function($1,$2,$3){return("<PRE class=CodeSamp>"+DvbbsHtmlAn($3)+"</PRE>")});content=content.replace(/\{(\/)?phx_code\}/ig,"[$1phx_code]");content=content.replace(/\{(\/)?phx_html\}/ig,"[$1phx_html]");alert('共耗时 '+eval(new Date().getTime()-st)+' ms');return(content);}function HTMLCode(content){ content="[phx_html]"+content+"[/phx_html]"; content=content.replace(/(\[html\]([\s\S]+?)\[\/html\])/ig,"[/phx_html]$1[phx_html]");content=content.replace(/\[phx_html\]([\s\S]*?)\[\/phx_html\]/ig,function($1,$2){return(trans($2))});content=content.replace(/\[html\]([\s\S]+?)\[\/html\]/ig,function($1,$2){return("<span><TEXTAREA cols=95 rows=12>"+hencode($2)+"</TEXTAREA><br><INPUT onclick=runCode() type=button value=运行代码>[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]</span>")});return(content);}function hencode(fString){ //简单模拟server.htmlencode ASP中不用这个 fString = fString.replace(/&/ig,"&amp;") fString = fString.replace(/>/ig,"&gt;") //> fString = fString.replace(/</ig,"&lt;") //<return fString;}function DvbbsHtmlAn(fString){if(fString=="")return("");fString=hencode(fString) fString = fString.replace(/\t/ig,"&nbsp;&nbsp;&nbsp;") //Tab fString = fString.replace(/"/ig,"&quot;") //" fString = fString.replace(/'/ig,"&#39;") //' fString = fString.replace(/\r/ig,"") //回车是一个13+10 fString = fString.replace(/\n\n/ig,"<P>") // fString = fString.replace(/\n/ig,"<BR>") //换行 fString = fString.replace(/\x20/ig,"&nbsp;") //空格 return(fString);}function trans(strContent){var re;strContent=DvbbsHtmlAn(strContent); re=/\[IMG\](.+?)\[\/IMG\]/ig; strContent=strContent.replace(re,"<a href=$1 target=_blank><IMG SRC=$1 <div style="text-align:left; margin-top:0px; clear:both;"> </div> <div id="tpage"> <span style="float:left;width:45%" class="text-truncate"> <img align="absmiddle" src="https://static.ruanchen.com/img/pre_art.gif" /> <a href="/tech/view/doc/71943/p/63/" title="showModelessDialog()使用详解">showModelessDialog()使用详解</a></span> <span style="float:right;width:45%;text-align:right" class="text-truncate"> <a href="/tech/view/doc/71945/p/63/" title="用js封装的时间设置器">用js封装的时间设置器</a> <img align="absmiddle" src="https://static.ruanchen.com/img/next_art.gif"/></span> </div> </div> <div style="clear:both;"> <script language="javascript"> var infoid = '71944'; var classid = 'tech'; </script> <script language="JavaScript" src="https://static.ruanchen.com/js/mood.js"></script> </div> <div id="cmt"> <h3> <img src="https://static.ruanchen.com/img/cmt.gif" align="absmiddle" /> 评论 (0) <small class="pagenav-listbar"> <a style="padding:5px;" href="javascript:tech_cmt('71944')">All</a> </small> </h3> <div id="cmt-list"></div> <form method="post" action="#cmt" onsubmit="alert('您还没有登陆，登陆后才能进行此操作。');return false;"> <textarea id="content" name="content" style="width:100%; height:100px;">

登陆 还没注册？