bbcode代码简易工具

08-10-28 freebox
一个bbcode的简易工具条

需要jquery1.2.6,其它的都在zip包里

其中图片除size.png、email.png属自制外,其它图片来自markitup项目(http://markitup.jaysalvat.com/downloads/)

继承以往惯例,在ie8中浮动条的样式难看,请自己修改。

运行不需要服务器环境,直接打开bbcode.htm即可,如果需要格式化页面输出,在页面载入后调用convert函数。
attachment:


bbcode.zip

1
banq
2008-10-29 09:34
太好了,多谢分享,顶顶,以后加到JiveJdon中,是不是这样效果?

http://markitup.jaysalvat.com/downloads/demo.php?id=releases/latest

你如果将效果拷屏,然后用图像软件保存jpg,上传或放到软件包,就更好了。哈哈。

freebox
2008-10-29 14:58
我弄的背景可没有人家的好看。主要是想不通过服务器转换html和bbcode这些代码,直接交给浏览器处理,fck太大也没兴趣看怎么实现的,当时找到markitup的时候他们还没加入表情和预览功能(现在已经加入了),所以就自己弄了一个更简易的。

有两个图片在附件里,有兴趣的话可以看一下效果。

目前已经实现了java代码关键字加色,有不同需要的语言关键字加色可以自定义,在“//初始化语言关键字”那一段,那段下面是Java关键字加色,我只加了三四个,像什么int都没加。

最近事挺多的,还有什么Fixme和todo也没改,ie里浮动窗效果也没改,要是有兴趣的朋友弄出了好效果还望指点。
attachment:


bbcode.zip

banq
2008-10-29 15:07
不错,可以在发言提交前,自己预视一下效果。可以作为在线简单html编辑器,用于文章CMS或博客系统。

我给贴一下图:第一章是语法;下面一张是效果:



freebox
2008-10-29 15:19
发言后也不需要服务器转码,直接存成bbcode,最后取出也是bbcode,显示的时候拿script来convert一下就好了,就像预览那样,当然在jquery里这需要在jsp的每个发言记录标记里加点东西,像class="result"之类的,之后

$(document).ready(function(){

$(".result").each(function(index,result){

var text=$(result).html();

text=rainbow_bb.convert(text);

$(result).html(text);

});

});

避免由服务器处理这种没什么意思的转换,让浏览器也干点活,当然ie有点问题,需要手动开启地址栏下面的惊叹号来让script运行。

freebox
2008-10-30 21:46
运行bbcode/bbcode.htm查看效果。

如果需要文件上载功能,需要先弄个服务器环境。

修正文件上下载功能。

图片jpeg.png来自http://commons.wikimedia.org/wiki/Crystal_ClearMIME-Types,其它图片来源见上面几帖中的说明,未做说明的属自制。

修正了一部分语法上色bug

附件上载文件是bbcode/attachment.htm

[该贴被freebox于2008-11-01 15:54修改过]
attachment:


bbcode.zip

猜你喜欢