處理圖像單擊ContentEditable區域中的事件

Question

我想自定義jwysiwyg jquery RTE。我想建立一個圖像屬性編輯器，這樣一旦圖像被插入到可編輯區域中，用戶就會選擇它，然後會出現一個模態窗口或屬性面板，允許用戶編輯寬度/高度等。類似於gmails圖像插入UI。

問題是我很難找到如何處理必要的圖像點擊事件。任何人都知道一些示例代碼或一些信息，我可以從哪裏開始？

Answer 1

我剛剛開始類似的事情。使用jQuery的委託（）方法中，我得到了它這樣的工作：

$("#bodyoftheeditordocument").delegate("img", "click", function (evt) { 
    // handle click event here... 
}); 

關於委託方法的很酷的事情是，它就會在體內，現在還是將來此事件處理程序連接到任何img標籤。因此，甚至連編輯過程中插入的圖像也可以連線。

祝你好運。

馬克

Answer 2

我在iOS 10的解決方案是一個CONTENTEDITABLE =「false」屬性添加到其中需要是可點擊的img元素。 否則，Safari會認爲你的意圖是在圖像前後插入插入符號，如果它位於可以引用的元素內。