我有這個文本編輯器plunker example問題是當我點擊粗體按鈕或任何其他按鈕時，按鈕不顯示可編輯的div的狀態，我知道如果我添加一個類到ng-mousedown事件的功能，但如果我點擊一個帶有粗體文本的區域，應該在正確的工具欄按鈕上添加一個類，也許我應該使用類似於監視器的東西，但要觀看什麼？如何在contenteditable div中監控文本樣式和格式？

更新

OK，我做了一些挖掘，我試圖觀看符的位置，所以我可以應用正確的樣式文本編輯器的工具欄按鈕我想過觀察家$但我從來沒有使用它們。
我使用的示例是從這個StackOverflow post有一個Jsfiddle在帖子中，但我做了一個plunker示例與AngularJS，它展示瞭如何獲得contenteditable div中的插入符號位置。
有沒有更好的方式來做到這一點，如獲取內部contenteditable div的DOM樹，然後製作元素和位置的映射，然後使用數據綁定來控制工具欄中按鈕的狀態？
任何幫助，在此先感謝。

來源

2013-04-14 Yahya KACEM

這是一個非常長的句子...... – mihai

剛剛更新了我的問題。 –

爲什麼不使用已經被調試並且是跨瀏覽器兼容的良好開發的編輯器。看起來像一個重新發明輪子的大事業 – charlietfl

我找到了答案在此SO post：

而不是做這一切的手，瀏覽器的方法來告訴你，如果當前選擇或插入符號是粗體，斜體或什麼：document.queryCommandState()（MSDN），對於諸如粗體和斜體的二進制命令，對於具有值的命令（例如與字體相關的命令）的命令document.queryCommandValue()（MSDN）。

來源

2013-04-15 07:05:16

如何在contenteditable div中監控文本樣式和格式？

更新

回答

相關問題