日常啰嗦

本來這一篇和接下來的幾篇是打算講一下JDBC和數據庫優(yōu)化的,但是最近很多朋友加我好友也討論了一些問題,我發(fā)現大家似乎都是拿這個項目作為練手項目,作為腳手架來用的,因此呢,改變了一下思路,JDBC和數據庫優(yōu)化這一塊兒延后一點再去說,先豐富一下項目的頁面和功能,因為現在的頁面實在有些少得可憐,所以我打算中間插入兩篇文章,給項目增加一個富文本編輯器的功能插件,再增加一個圖片上傳的功能,把這個腳手架的內容再充實一下。
我的github地址,點這里

初識富文本編輯器

先看兩張圖片:

1、這是一張普通的新聞詳情頁截圖

iOS培訓,Swift培訓,蘋果開發(fā)培訓,移動開發(fā)培訓

2、這是一張京東的商品詳情頁截圖

iOS培訓,Swift培訓,蘋果開發(fā)培訓,移動開發(fā)培訓
對于這種頁面大家都不陌生,翻新聞的時候經常是這種圖文并茂的圖片才能更好的吸引眼球,而商品詳情圖頁基本都是介紹信息加商品的實景圖片才能更準確的吸引買家。
為什么把這兩張圖片拿出來了呢?
這要談起往事了,我剛剛開始做開發(fā)的時候,有一次就負責開發(fā)這種類似的頁面,那個頁面叫新聞詳情,也是類似這種頁面的排版布局,設計稿中的文字和圖片依次排開,很是美觀,我當時就鬧了個笑話,因為需要實現后端功能,我就開始思考,詳情表該怎么設計呢?表結構是不是該這么設計,主鍵+介紹信息字段+圖片字段+介紹信息字段+圖片字段....我把這個詳情全給拆開了,但是當我再看另一個設計稿的時候,我懵掉了,因為和第一張的排版不同,不是文字+圖片+...,而是圖片+圖片+文字...,我當時就不知道該怎么做了,當時的心理活動是怎么實際開發(fā)項目這么難?。恳呀浢壬艘饬?,哈哈哈。
看到這里,你可能知道我當時為什么會被難住了,因為我不知道富文本編輯器的概念,也沒有用過類似的富文本編輯器,因此這個簡簡單單的需求被我想得太復雜了,其實很簡單的在表中設置一個字段就可以了。
什么是富文本編輯器?

富文本編輯器,是一種可內嵌于瀏覽器,所見即所得的文本編輯器。
富文本編輯器不同于文本編輯器(如textarea標簽、input標簽),也可以叫做圖文編輯器,在富文本編輯器里可以編輯非常豐富的內容,如文字、圖片、表情、代碼......應有盡有,滿足你的大部分需求。
像一些新聞排版,基本是以圖文排版為主,而淘寶京東這些電商的商品詳情頁,基本都是多張已經排版好的設計圖拼接而來的,富文本編輯器可以很完美的支持者兩種需求。

UEditor簡介

富文本編輯器有很多,功能都是類似的,今天我要介紹的是UEditor,B公司開源的一款產品。
官網地址:http://ueditor.baidu.com/website/
完整的功能演示,可以參考:

網友評論