经典论坛的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> blue 以下内容为程序代码:te st 以下内容为程序代码:以下内容为程序代码:te st 以下内容为程序代码:以下内容为程序代码:te st</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,"&") fString = fString.replace(/>/ig,">") //> fString = fString.replace(/</ig,"<") //< return fString; } function DvbbsHtmlAn(fString){ if(fString=="")return(""); fString=hencode(fString) fString = fString.replace(/\t/ig," ") //Tab fString = fString.replace(/"/ig,""") //" fString = fString.replace(/'/ig,"'") //' 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," ") //空格 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 border=0 alt=按此在新窗口浏览图片 onload=\"javascript:if(this.width>screen.width-333)this.width=screen.width-333\" galleryImg=no></a>"); re=/\[DIR=*([0-9]*),*([0-9]*)\](.*?)\[\/DIR]/ig strContent=strContent.replace(re,"<object classid=clsid:166B1BCA-3F9C-11CF-8075-444553540000 codebase=http://download.macromedia.com/pub/shockwave/cabs/director/sw.cab#version=7,0,2,0 width=$1 height=$2><param name=src value=$3><embed src=$3 pluginspage=http://www.macromedia.com/shockwave/download/ width=$1 height=$2></embed></object>") re=/\[QT=*([0-9]*),*([0-9]*)\](.*?)\[\/QT]/ig strContent=strContent.replace(re,"<embed src=$3 width=$1 height=$2 autoplay=true loop=false controller=true playeveryframe=false cache=false scale=TOFIT bgcolor=#000000 kioskmode=false targetcache=false pluginspage=http://www.apple.com/quicktime/>") re=/\[MP=*([0-9]*),*([0-9]*)\](.*?)\[\/MP]/ig strContent=strContent.replace(re,"<object align=middle classi<br>[首页] [上一页] <a href=131954-2.asp><font color="#FF0000">[下一页]</font></a> <a href=131954-7.asp><font color="#FF0000">[末页]</font></a> <select onchange=if(this.options[this.selectedIndex].value!=''){location=this.options[this.selectedIndex].value;}><option value="" selected>选择页数</option><option value="131954.asp">1</option><option value="131954-2.asp">2</option><option value="131954-3.asp">3</option><option value="131954-4.asp">4</option><option value="131954-5.asp">5</option><option value="131954-6.asp">6</option><option value="131954-7.asp">7</option></select> <table align=center><tr><td> <p align=center> © CopyRight 2002-2004, CHINAZ.COM </p> </td></tr></table>