富文本編輯器TinyMCE菜鳥使用教程

系統(tǒng):windows10

工具:Visual Studio 2017

語言:C#

????????我正在做畢設(shè),需要保存信息,直接保存到數(shù)據(jù)庫的文本沒有格式,問過老師之后明白需要使用富文本編輯器接收信息,然后存入數(shù)據(jù)庫。老師給我了一個(gè)Ckeditor,個(gè)人感覺比較丑,(主要是老師沒有給使用文檔,我作為一個(gè)完完全全的小菜鳥,根本不會(huì)使),我就從網(wǎng)上找好看并且好用的富文本編輯器,TinyMCE就是最佳的選擇。

? ? ? ? 我后臺(tái)使用的是一般處理程序。

? ? ? ? 我們先來看一下TinyMCE的效果圖


個(gè)人感覺還是比較好看的?,F(xiàn)在給大家講如何使用。

首先,你需要進(jìn)入TinyMCE官網(wǎng)免費(fèi)注冊(cè)一下,得到一個(gè)免費(fèi)的Key,如圖

TinyMCE官網(wǎng):The Most Advanced WYSIWYG HTML Editor | TinyMCE

原裝的富文本編輯器是英文的,如果你想使用中文的話,請(qǐng)點(diǎn)擊Language Packages | TinyMCE這里,下載對(duì)應(yīng)語言的js文件。

下載成功后,把文件解壓,放在langs/...文件夾中,把文件夾放入解決方案。

然后在前端,html頁面,<head></head>中間,引入.

代碼1

<script src="https://cloud.tinymce.com/5/tinymce.min.js?apiKey=這里放入你注冊(cè)時(shí),系統(tǒng)分配給你的Key"></script>

<script src="../langs/zh_CN.js"></script>

而后繼續(xù)添加

代碼2

<script type="text/javascript">???

?????tinymce.init({????????

????????selector: 'textarea',????????

????????language: 'zh_CN',???

?????});

</script>

此時(shí)引用結(jié)束。現(xiàn)在在正文<body></body>中你理想的位置,添加一下代碼

代碼3

<form method="post">

????<textarea id="mytextarea">Hello, World!</textarea>?

</form>

現(xiàn)在大體結(jié)構(gòu)已經(jīng)完成,看一下成果吧


如圖!這就是成果。

如果你不想要“文件”那一欄,就在代碼2中,添加這句話

menubar: false,

如果不想要“加粗”那一欄,就在代碼2中,添加這句話

toolbar: false,

想要在后臺(tái)接受富文本編輯器中內(nèi)容,則需要把?<textarea id="mytextarea">Hello, World!</textarea> 添加name屬性,然后在后臺(tái)接受

例如我的代碼為

?<textarea id="mytextarea" name="content">Hello, World!</textarea>

使用string? content=context.Request["content"];來接受文本即可。

以下就是Tiny簡單實(shí)用辦法

不過,我在使用的時(shí)候,后臺(tái)使用string接受富文本編輯器中內(nèi)容時(shí),出現(xiàn)一個(gè)問題,如圖


這個(gè)時(shí)候需要在Web.config<system.web></system.web>標(biāo)簽中,添加

<pages validateRequest="false" />

在<httpRuntime targetFramework="4.6.1"/>中添加

requestValidationMode="2.0"

成為

<httpRuntime targetFramework="4.6.1" requestValidationMode="2.0" />

即可!


新手小白,如果有不對(duì)的,還請(qǐng)大佬指教!,如果有人有對(duì)一般處理程序感興趣的話,也可以關(guān)注我微信公眾號(hào):Wuluo_97? ? ? 大家一起探討鴨!

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容