web項目中nicedit富文本編輯器的使用


web項目中nicedit富文本編輯器的使用

一、為什么要用富文本編輯器?

先說什么是富文本編輯器吧,普通的html中input或textarea標簽只能進行簡單的輸入,而做不到其他的文本調整功能,甚至

連空格與回車都要另寫工具類去識別,更談不上字體大小和顏色的修改、整體排版都功能了。其實一般讀入文段類型的輸入框都需

要富文本編輯器,沒錯,你們平時寫博客用的就是富文本編輯器。如果還是無法理解富文本與普通輸入框的區別,請看下圖:

     

 二、為什么要選nicedit

同類富文本編輯器有很多,這里選nicedit來說並不是因為它有多好,反而它功能並不全面,也不是很好看,

不過它有幾個很大的優點:兼容性好、簡單輕量、適合作為后台管理人員的錄入框。

三、使用方法

1.下載nicedit工具包,包內目錄如下

    

      2.把nicEdit.js和nicEditorIcons.gif文件復制到web項目中,放平時放靜態資源的位置即可

           

3.在nicEdit.js中修改nicEditorIcons.gif在項目中的位置

      

4.在jsp中代碼如下(注意修改js所在路徑):

      

5.獲取富文本輸入的值,注意這里用textarea的id和值是獲取不了的,因為nicedit會隱藏原有的textarea,並生成自帶的輸入框,這是要獲取框內

文本就需要通過其生成的類名去獲取,代碼實現如下:

  

  我這里為了方便表單直接提交,就在按鈕事件觸發時直接把富文本內的值獲取出來,並賦給表單中隱藏的input.

 

到這里nicedit富文本就能達到使用目的了,需要的文件只有一個js文件和一張圖片,是不是真的很輕量很簡單?所以,在只需實現簡單的文段編輯功能

時,可以考慮使用這個富文本編輯器。分享完畢,謝謝閱讀。

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM