首页   关于我们   网站建设   上海兼职网站制作  兼职网站设计  网站案例   网站知识   联系我们   

自己动手,结合javascript和dhtml做一个ubb编辑器_QQread.com

发布于:2007-9-30 已被阅读: 次 来源:上兼职海网站建设

看到chinaASP论坛的abc code editor了吗?是不是觉得很cool? 说真的,刚见到我还以为是用别的什么语言做的控件呢,后来才发现没有那么神秘的。前几天做一个商品bbs,客户要求支持ubb,同时也要做一个编辑器。现在我把做ubb的思路给大家讲一下。    首先遇到的是界面问题,实际上这个很好解决,只是利用td的onmouseover、onmouseout和onmousedown来实现,具体实现方法件下面的代码。    其次就是实现文本效果的问题,这个可以利用textRange的execCommand方法来实现。   下面我给出一个简单的例子,你可以把它存为一个html文件,直接可以运行,这个例子的功能很简单,就是把编辑框中选定的文字变为粗体或斜体。其他功能你可以参照这个例子自己加上。对了,先把这两个图片存下来。file : ubb.html<HTML><HEAD><TITLE>ubb演示<网站TITLE><网站HEAD><BODY><br><br><table width=300 cellspacing=2 cellpadding=2 border=0  bgcolor=lightgrey>   <tr>       <td id=tdBold  onclick=doAction("Bold") onmousedown="DoDown(tdBold );" onmouseover = "On_Mouseover(tdBold) ;" onmouseout="On_Mouseout(tdBold);">          <img src='bold.gif' width=16 height=16  >       <网站td>       <td id=tdItalic onclick=doAction("Italic") onmousedown="DoDown(tdItalic);" onmouseover = "On_Mouseover(tdItalic) ;" onmouseout="On_Mouseout(tdItalic);">          <img src='italic.gif' width=16 height=16 >       <网站td>       <td width=268>&nbsp;<网站td>   <网站tr>   <tr>       <td colspan=3>         <iframe id=Editor name=Editor border=0 scroll=no width=300 height=200>         <网站iframe>       <网站td>   <网站tr><网站table>           <网站BODY><网站HTML><script language=javascript>    webinitialize the iframe  Editor.document .designMode = "On" ;  Editor.document .open ;  Editor.document .write ("&nbsp;") ;  Editor.document .close ;  Editor.focus ();    function On_Mouseover(thisTD)    {      thisTD.style .borderLeft = "1px solid buttonhighlight" ;      thisTD.style .borderRight = "1px solid buttonshadow";      thisTD.style .borderTop = "1px solid buttonhighlight";      thisTD.style .borderBottom = "1px solid buttonshadow";    }  function On_Mouseout(thisTD)    {      thisTD.style .borderLeft = "" ;      thisTD.style .borderRight = "";      thisTD.style .borderTop = "";      thisTD.style .borderBottom = "";    }      function DoDown(thisTD)    {        thisTD.style .borderLeft   = "1px solid buttonshadow";        thisTD.style .borderRight  = "1px solid buttonhighlight";        thisTD.style .borderTop    = "1px solid buttonshadow";        thisTD.style .borderBottom = "1px solid buttonhighlight";        thisTD.style .paddingTop    = "2px";        thisTD.style .paddingLeft   = "2px";        thisTD.style .paddingBottom = "0px";        thisTD.style .paddingRight  = "0px";        }        function doAction(str)    {      var m_objTextRange = Editor.document .selection.createRange();      m_objTextRange.execCommand(str) ;    }        <网站script>      进入讨论组讨论。 建设 javascript实现通用表单验证函数javascript版的日期输入控件探求JavaScript开发工具JavaScript实现AJAX的拖动效果 制作

网站建设相关信息

上兼职海网站建设服务

一、网站建设套餐A型
1个英文.COM域名
80M独立网站空间
25M邮件空间,5个企业邮箱
1个FLASH首页,10个精美内页
网站建设优惠价:面谈

二、网站建设套餐B型
1个英文.COM域名
120M独立网站空间,加75M备份,免费Access数据库
50M邮件空间,10个企业邮箱
1个FLASH首页,20个精美内页
1个新闻发布系统
1个计数器,一个留言板
网站建设优惠价:面谈

三、网站建设套餐C型
1个英文.COM域名
250M独立网站空间,加125M备份,免费Access数据库
100M邮件空间,20个企业邮箱
1个FLASH首页,30个精美内页
一个新闻发布系统
一个产品发布系统
1个计数器,一个留言板
网站建设优惠价:面谈

网站知识

什么是网站运营?
网络营销-网站优化
提高博客人气的方法
整站优化要注意平衡
如何为企业的网站建设准备
高难上海兼职网站制作的心得
什么样网页布局是你最喜欢
一个好的网站建设应该
网页设计师的薪水标准
上海兼职网站制作中心对
保持网站建设制作流量