当前位置: 首页 > 图文教程 > 网页制作 > Dreamweaver > UBB 转换函数演示

Dreamweaver
Dreamweaver MX进阶教程(十八)使用css样式制作细线表格
Dreamweaver MX进阶教程(二十二)制作反馈表单(email发送)
Dreamweaver MX进阶教程(二十)使用一象素透明图像固定单元格宽度
Dreamweaver MX进阶教程(十一)使用“层”布局网页
Dreamweaver MX进阶教程(十四)使用server-side include(服务器端包括)
Dreamweaver MX进阶教程(十五)插入具有辅助功能的表格
Dreamweaver MX进阶教程(十九)防止英文字符撑破表格
Dreamweaver MX进阶教程(十七)设置表格的属性
Dreamweaver MX进阶教程(十二)在居中页面使用层
DW MX 设计留言本实战(1)
DW MX 设计留言本实战(4)
DreamWeaver,经典50问(9)
DreamWeaver,经典50问(8)
DreamWeaver,经典50问(7)
DreamWeaver,经典50问(3)
DreamWeaver,经典50问(10)
DreamWeaver,经典50问(4)
DreamWeaver,经典50问(6)
巧用背景颜色和间距快速制作出细边线表格
DW MX 2004代码编辑新功能

Dreamweaver 中的 UBB 转换函数演示


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-23   浏览: 23 ::
收藏到网摘: n/a

    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][color=blue]blue[/color][/b][/i]

[html][color=red]te
st[/color][/html]

[html][code]te
st[/code][/html]

[code][html]te
st[/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>")    //换行