ubbeditor 文字編輯器 使用方法
阿新 • • 發佈：2018-12-22
把下載解壓後的資料夾ubbeditor 全部拷貝到開發的專案中去
首先引入相關的js檔案
<meta http-equiv="x-ua-compatible" content="IE=EmulateIE7" />//預設支援IE瀏覽器
<script type="text/javascript" src="../ubbeditor/ubbEditor.js"> //與專案引用的js 路徑一致
主要程式碼
<textarea id="content" name="content" style="WIDTH: 600px; HEIGHT: 300px"></textarea> //這裡是一個評論框 <script type="text/javascript"> var nEditor = new ubbEditor('content'); nEditor.tLang = 'zh-cn'; nEditor.tInit('nEditor', '../ubbeditor/'); //這裡是載入圖片的路徑 和專案中的路徑保持一致 </script>
獲取ubbeditor 的 值不能直接 用 $(’#content’).val();這樣獲取不到 應該用屬性選擇器的方式獲得
如： $("[name=‘content’]").val()
另外從這個評論框寫入的訊息 在顯示時候需要過濾 否則顯示一堆火星文
後臺過濾程式碼如下
public static string UBBToHTML(string sDetail) { Regex r; Match m; #region 處理空格 sDetail = sDetail.Replace(" ", " "); #endregion #region 處理單引號 sDetail = sDetail.Replace("'", "’"); #endregion #region 處理雙引號 sDetail = sDetail.Replace("\"", """); #endregion #region html標記符 sDetail = sDetail.Replace("<", "<"); sDetail = sDetail.Replace(">", ">"); #endregion #region 處理換行 //處理換行，在每個新行的前面新增兩個全形空格 r = new Regex(@"(\r\n(( )| )+)(?<正文>\S+)", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<BR> " + m.Groups["正文"].ToString()); } //處理換行，在每個新行的前面新增兩個全形空格 sDetail = sDetail.Replace("\r\n", "<BR>"); #endregion #region 處[b][/b]標記 r = new Regex(@"(\[b\])([ \S\t]*?)(\[\/b\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<B>" + m.Groups[2].ToString() + "</B>"); } #endregion #region 處[i][/i]標記 r = new Regex(@"(\[i\])([ \S\t]*?)(\[\/i\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<I>" + m.Groups[2].ToString() + "</I>"); } #endregion #region 處[u][/u]標記 r = new Regex(@"(\[U\])([ \S\t]*?)(\[\/U\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<U>" + m.Groups[2].ToString() + "</U>"); } #endregion #region 處[p][/p]標記 //處[p][/p]標記 r = new Regex(@"((\r\n)*\[p\])(.*?)((\r\n)*\[\/p\])", RegexOptions.IgnoreCase | RegexOptions.Singleline); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<P class=\"pstyle\">" + m.Groups[3].ToString() + "</P>"); } #endregion #region 處[sup][/sup]標記 //處[sup][/sup]標記 r = new Regex(@"(\[sup\])([ \S\t]*?)(\[\/sup\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<SUP>" + m.Groups[2].ToString() + "</SUP>"); } #endregion #region 處[sub][/sub]標記 //處[sub][/sub]標記 r = new Regex(@"(\[sub\])([ \S\t]*?)(\[\/sub\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<SUB>" + m.Groups[2].ToString() + "</SUB>"); } #endregion #region 處標記 //處標記 r = new Regex(@"(\[url\])([ \S\t]*?)(\[\/url\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<A href=\"" + m.Groups[2].ToString() + "\" target=\"_blank\">" + m.Groups[2].ToString() + "</A>"); } #endregion #region 處[url=xxx][/url]標記 //處[url=xxx][/url]標記 r = new Regex(@"(\[url=([ \S\t]+)\])([ \S\t]*?)(\[\/url\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<A href=\"" + m.Groups[2].ToString() + "\" target=\"_blank\">" + m.Groups[3].ToString() + "</A>"); } #endregion #region 處[email][/email]標記 //處[email][/email]標記 r = new Regex(@"(\[email\])([ \S\t]*?)(\[\/email\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<A href=\"mailto:" + m.Groups[2].ToString() + "\" target=\"_blank\">" + m.Groups[2].ToString() + "</A>"); } #endregion #region 處[email=xxx][/email]標記 //處[email=xxx][/email]標記 r = new Regex(@"(\[email=([ \S\t]+)\])([ \S\t]*?)(\[\/email\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<A href=\"mailto:" + m.Groups[2].ToString() + "\" target=\"_blank\">" + m.Groups[3].ToString() + "</A>"); } #endregion #region 處[size=x][/size]標記 //處[size=x][/size]標記 r = new Regex(@"(\[size=([1-7])\])([ \S\t]*?)(\[\/size\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<FONT SIZE=" + m.Groups[2].ToString() + ">" + m.Groups[3].ToString() + "</FONT>"); } #endregion #region 處[color=x][/color]標記 //處[color=x][/color]標記 r = new Regex(@"(\[color=([\S]+)\])([ \S\t]*?)(\[\/color\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<FONT COLOR=" + m.Groups[2].ToString() + ">" + m.Groups[3].ToString() + "</FONT>"); } #endregion #region 處[font=x][/font]標記 //處[font=x][/font]標記 r = new Regex(@"(\[font=([\S]+)\])([ \S\t]*?)(\[\/font\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<FONT FACE=" + m.Groups[2].ToString() + ">" + m.Groups[3].ToString() + "</FONT>"); } #endregion #region 處理圖片連結 //處理圖片連結 r = new Regex("\\[picture\\](\\d+?)\\[\\/picture\\]", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<A href=\"ShowImage.aspx?Type=ALL&Action=forumImage&ImageID=" + m.Groups[1].ToString() + "\" target=\"_blank\"><IMG border=0 Title=\"點選開啟新視窗檢視\" src=\"ShowImage.aspx?Action=forumImage&ImageID=" + m.Groups[1].ToString() + "\"></A>"); } #endregion #region 處理[align=x][/align] //處理[align=x][/align] r = new Regex(@"(\[align=([\S]+)\])([ \S\t]*?)(\[\/align\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<P align=" + m.Groups[2].ToString() + ">" + m.Groups[3].ToString() + "</P>"); } #endregion #region 處[H=x][/H]標記 //處[H=x][/H]標記 r = new Regex(@"(\[H=([1-6])\])([ \S\t]*?)(\[\/H\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<H" + m.Groups[2].ToString() + ">" + m.Groups[3].ToString() + "</H" + m.Groups[2].ToString() + ">"); } #endregion #region 處理[list=x][*][/list] //處理[list=x][*][/list] r = new Regex(@"(\[list(=(A|a|I|i| ))?\]([ \S\t]*)\r\n)((\[\*\]([ \S\t]*\r\n))*?)(\[\/list\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { string strLI = m.Groups[5].ToString(); Regex rLI = new Regex(@"\[\*\]([ \S\t]*\r\n?)", RegexOptions.IgnoreCase); Match mLI; for (mLI = rLI.Match(strLI); mLI.Success; mLI = mLI.NextMatch()) { strLI = strLI.Replace(mLI.Groups[0].ToString(), "<LI>" + mLI.Groups[1]); } sDetail = sDetail.Replace(m.Groups[0].ToString(), "<UL TYPE=\"" + m.Groups[3].ToString() + "\"><B>" + m.Groups[4].ToString() + "</B>" + strLI + "</UL>"); } #endregion #region 處[SHADOW=x][/SHADOW]標記 //處[SHADOW=x][/SHADOW]標記 r = new Regex(@"(\[SHADOW=)(\d*?),(#*\w*?),(\d*?)\]([\S\t]*?)(\[\/SHADOW\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<TABLE WIDTH=" + m.Groups[2].ToString() + "STYLE=FILTER:SHADOW(COLOR=" + m.Groups[3].ToString() + ",STRENGTH=" + m.Groups[4].ToString() + ")>" + m.Groups[5].ToString() + "</TABLE>"); } #endregion #region 處[glow=x][/glow]標記 //處[glow=x][/glow]標記 r = new Regex(@"(\[glow=)(\d*?),(#*\w*?),(\d*?)\]([\S\t]*?)(\[\/glow\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<TABLE WIDTH=" + m.Groups[2].ToString() + " STYLE=FILTER:GLOW(COLOR=" + m.Groups[3].ToString() + ", STRENGTH=" + m.Groups[4].ToString() + ")>" + m.Groups[5].ToString() + "</TABLE>"); } #endregion #region 處[center][/center]標記 r = new Regex(@"(\[center\])([ \S\t]*?)(\[\/center\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<CENTER>" + m.Groups[2].ToString() + "</CENTER>"); } #endregion #region 處[ IMG][ /IMG]標記 r = new Regex(@"(\[IMG\])(http|https|ftp):\/\/([ \S\t]*?)(\[\/IMG\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<br><a onfocus=this.blur() href=" + m.Groups[2].ToString() + "://" + m.Groups[3].ToString() + " target=_blank><IMG SRC=" + m.Groups[2].ToString() + "://" + m.Groups[3].ToString() + " border=0 alt=按此在新視窗瀏覽圖片 onload=javascript:if(screen.width-333<this.width)this.width=screen.width-333></a>"); } #endregion #region 處[em]標記 r = new Regex(@"(\[em([\S\t]*?)\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<img src=pic/em" + m.Groups[2].ToString() + ".gif border=0 align=middle>"); } #endregion #region 處[flash=x][/flash]標記 //處[mp=x][/mp]標記 r = new Regex(@"(\[flash=)(\d*?),(\d*?)\]([\S\t]*?)(\[\/flash\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<a href=" + m.Groups[4].ToString() + " TARGET=_blank><IMG SRC=pic/swf.gif border=0 alt=點選開新視窗欣賞該FLASH動畫!> [全屏欣賞]</a><br><br><OBJECT codeBase=http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0 classid=clsid:D27CDB6E-AE6D-11cf-96B8-444553540000 width=" + m.Groups[2].ToString() + " height=" + m.Groups[3].ToString() + "><PARAM NAME=movie VALUE=" + m.Groups[4].ToString() + "><PARAM NAME=quality VALUE=high><param name=menu value=false><embed src=" + m.Groups[4].ToString() + " quality=high menu=false pluginspage=http://www.macromedia.com/go/getflashplayer type=application/x-shockwave-flash width=" + m.Groups[2].ToString() + " height=" + m.Groups[3].ToString() + ">" + m.Groups[4].ToString() + "</embed></OBJECT>"); } #endregion #region 處[dir=x][/dir]標記 //處[dir=x][/dir]標記 r = new Regex(@"(\[dir=)(\d*?),(\d*?)\]([\S\t]*?)(\[\/dir\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<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=" + m.Groups[2].ToString() + " height=" + m.Groups[3].ToString() + "><param name=src value=" + m.Groups[4].ToString() + "><embed src=" + m.Groups[4].ToString() + " pluginspage=http://www.macromedia.com/shockwave/download/ width=" + m.Groups[2].ToString() + " height=" + m.Groups[3].ToString() + "></embed></object>"); } #endregion #region 處[rm=x][/rm]標記 //處[rm=x][/rm]標記 r = new Regex(@"(\[rm=)(\d*?),(\d*?)\]([\S\t]*?)(\[\/rm\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<OBJECT classid=clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA class=OBJECT id=RAOCX width=" + m.Groups[2].ToString() + " height=" + m.Groups[3].ToString() + "><PARAM NAME=SRC VALUE=" + m.Groups[4].ToString() + "><PARAM NAME=CONSOLE VALUE=Clip1><PARAM NAME=CONTROLS VALUE=imagewindow><PARAM NAME=AUTOSTART VALUE=true></OBJECT><br><OBJECT classid=CLSID:CFCDAA03-8BE4-11CF-B84B-0020AFBBCCFA height=32 id=video2 width=" + m.Groups[2].ToString() + "><PARAM NAME=SRC VALUE=" + m.Groups[4].ToString() + "><PARAM NAME=AUTOSTART VALUE=-1><PARAM NAME=CONTROLS VALUE=controlpanel><PARAM NAME=CONSOLE VALUE=Clip1></OBJECT>"); } #endregion #region 處[mp=x][/mp]標記 //處[mp=x][/mp]標記 r = new Regex(@"(\[mp=)(\d*?),(\d*?)\]([\S\t]*?)(\[\/mp\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<object align=middle classid=CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95 class=OBJECT id=MediaPlayer width=" + m.Groups[2].ToString() + " height=" + m.Groups[3].ToString() + " ><param name=ShowStatusBar value=-1><param name=Filename value=" + m.Groups[4].ToString() + "><embed type=application/x-oleobject codebase=http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701 flename=mp src=" + m.Groups[4].ToString() + " width=" + m.Groups[2].ToString() + " height=" + m.Groups[3].ToString() + "></embed></object>"); } #endregion #region 處[qt=x][/qt]標記 //處[qt=x][/qt]標記 r = new Regex(@"(\[qt=)(\d*?),(\d*?)\]([\S\t]*?)(\[\/qt\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<embed src=" + m.Groups[4].ToString() + " width=" + m.Groups[2].ToString() + " height=" + m.Groups[3].ToString() + " autoplay=true loop=false controller=true playeveryframe=false cache=false scale=TOFIT bgcolor=#000000 kioskmode=false targetcache=false pluginspage=http://www.apple.com/quicktime/>"); } #endregion #region 處[QUOTE][/QUOTE]標記 r = new Regex(@"(\[QUOTE\])([ \S\t]*?)(\[\/QUOTE\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<div style='border:#CCCCCC 1px dashed; width:94%; color:#999999; padding:3px; background:#F8F8F8'>" + m.Groups[2].ToString() + "</div><br /> "); } #endregion #region 處[move][/move]標記 r = new Regex(@"(\[move\])([ \S\t]*?)(\[\/move\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<MARQUEE scrollamount=3>" + m.Groups[2].ToString() + "</MARQUEE>"); } #endregion #region 處[FLY][/FLY]標記 r = new Regex(@"(\[FLY\])([ \S\t]*?)(\[\/FLY\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<MARQUEE width=80% behavior=alternate scrollamount=3>" + m.Groups[2].ToString() + "</MARQUEE>"); } #endregion #region 處[image][/image]標記 //處[image][/image]標記 r = new Regex(@"(\[image\])([ \S\t]*?)(\[\/image\])", RegexOptions.IgnoreCase); for (m = r.Match(sDetail); m.Success; m = m.NextMatch()) { sDetail = sDetail.Replace(m.Groups[0].ToString(), "<img src=\"" + m.Groups[2].ToString() + "\" border=0 align=middle><br>"); } #endregion return sDetail; }
這個方法就是拼正則表達試