以下為本站文章分類清單

  1. AJAXspacer
  2. ASPspacer
  3. CSSspacer
  4. Javascriptspacer
  5. Windows 應用程式spacer
  6. 網頁設計
  7. 評論、短文、雜文spacer
  8. 版主spacer
  9. 最新回應spacer

以下為本頁本文內容

自製 WYSIWYG RichEditor 探討(3)-contentEditable

10/8 12' icon

Photo by ckeditor.com/

這個主題,在這段文字仍存在時,仍是進行式,內容是對於網頁編輯器(Rich Text Editor)製作的討論,隨時我會修正文中的錯誤,這並非已可套用的內容,請網友注意並包涵。

相關文章

先前討論過的 designMode 屬性,適用於整份文件,於是,幾乎所有關於自製編輯器的文章,都是以 iframe 來製作編輯器。

而在 Firefox 3.5+ , chrome 6+,IE 6+之後,導入了 contentEditable 這個個屬性,則可以讓元件單獨進入可編輯狀態,語法相當簡單,如下

<TAG contentEditable="true"></TAG>

contentEditable 可用的值有 true/false/inherit,預設為 inherit,也就是繼承父層的可編器性,例如指定表格為可編輯,那單一的儲格格自動繼承可編輯屬性。

來看一下範例

     
     
     
     
     

上面的表格,有底色的兩個儲存格不可編輯,你可以自由的在儲存格中加入文字,刪除等動作。使用 execCommand() 指令時,仍以 document.execCommand(args) 來執行即可

document 就是 document 這個字,不是代表任何文件物件。

而 Javascript DOM 語法則為

el.contetnEditable='true'

請注意大小寫以及設定值為字串,而非布林值。

與其他編輯器比較起來,使用 contentEditable 可以輕易地在文件中設定多處可編輯區域,但是內容控制,只要一組即可,使用 iframe 來編輯時,每個 iframe 要有自己的內容控制,這也是為什麼所有網頁編輯器,都有一個類似 genereAll 的指令,把整份文件中的 iframe 全部變成可編輯區。

這對於只需要簡單編輯功用的人來說,例如只要可調文字大小、顏色等簡單功能時,就實在太方便了。

 

以下為文章回應區

同意轉載,不過麻煩看一下轉載需知

How we can increase our height?   2017/8/4 下午 02:08:00

My brother suggested I might like this website.
He was once entirely right. This post truly made my day.
You can not consider simply how a lot time I had spent for this information! Thank you!

How can you get taller in a week?   2017/8/4 下午 01:59:00

Highly descriptive post, I enjoyed that a lot.

Will there be a part 2?

Can Pilates make you look taller?   2017/7/31 上午 10:37:00

I simply could not go away your web site prior to suggesting that I extremely loved the usual info a person provide for your guests?
Is going to be again steadily in order to check up on new posts

katherincruikshank.hatenablog.com   2017/7/30 下午 11:55:00

Thanks for sharing your thoughts on Photo Shop PhotoShop DHTML Dynamic HTML DynamicHTML
CSS Cascading Style Sheet JavaScript Demo Cool Website Audi
Carousel 動態網頁 設計 專業 網站 討論區 動態網站.
Regards

How do you grow?   2017/7/28 上午 10:54:00

Hey there! Someone in my Facebook group shared this site with us so I
came to check it out. I'm definitely enjoying the information. I'm bookmarking and
will be tweeting this to my followers! Great blog and brilliant style and design.

What makes you grow taller during puberty?   2017/7/21 下午 07:57:00

I like the valuable information you supply in your articles.

I will bookmark your blog and check again right here frequently.
I am somewhat sure I'll be informed a lot of new stuff proper here!
Best of luck for the following!

foot pain f   2017/7/3 上午 11:08:00

Thanks for finally talking about >【卜維丰】自製 WYSIWYG RichEditor 探討(3)-contentEditable <Loved it!

ankle an foot pain   2017/7/3 上午 09:46:00

Right here is the perfect site for anybody who would like to
find out about this topic. You understand a
whole lot its almost tough to argue with you (not that I personally would want to?HaHa).
You certainly put a new spin on a topic which has been discussed
for years. Wonderful stuff, just excellent!

返回原处   2017/6/24 下午 07:24:00

My brother suggested I would possibly like this web site.
He was entirely right. This post actually made my day.

You cann't consider just how much time I had spent for this information! Thank you!

fideliapasquarielloo.wordpress.com   2017/6/17 上午 12:18:00

Having read this I thought it was extremely enlightening.
I appreciate you spending some time and effort to put this informative
article together. I once again find myself personally spending a lot of time both reading and posting comments.

But so what, it was still worth it!

   2017/6/12 下午 02:31:00

Howdy just wanted to give you a brief heads up and let
you know a few of the pictures aren't loading correctly.
I'm not sure why but I think its a linking issue.
I've tried it in two different browsers and both show the same results.

   2017/6/11 上午 05:23:00

Yes! Finally something about fuck it.

agathabekius.weebly.com   2017/5/8 下午 06:33:00

Hi there, You have done an incredible job.
I'll definitely digg it and individually recommend to my friends.
I am confident they will be benefited from this web site.

   2017/4/29 下午 06:04:00

First off I would like to say awesome blog! I had
a quick question which I'd like to ask if you don't mind.
I was curious to know how you center yourself and clear your head
before writing. I've had difficulty clearing my
mind in getting my thoughts out. I truly do take pleasure in writing however it just seems like the first 10 to 15 minutes are lost simply just trying to figure
out how to begin. Any recommendations or hints?

Kudos!

manicure   2017/4/11 下午 06:30:00

This information is worth everyone's attention. Where
can I find out more?

給個回應
姓名:
佈落格網址:
  如果您是要發問問題, 最好有個問題測試的網址, 這樣比較容易找到您問題所在, 謝謝
內容: