使用mshtml設置contentEditable，防止選擇div

我目前的項目涉及使用文檔編輯器，無論好壞，都使用mshtml並將contentEditable設置爲true來實現。我們當然正在考慮用其他方式取代這種設置，但目前認爲這不是一種選擇。使用mshtml設置contentEditable，防止選擇div

在如此重要的情況下，我們這樣做是使用VS 2008（.NET 3.5）& C＃：

document = (HtmlDocument)this.editorWebBrowser.Document; 
body = (HtmlBody)document.body; 
body.contentEditable = true;

我們想隱藏我們的大多數用戶界面背後的結構化編輯的，而是讓用戶以任何他們喜歡的方式編輯文本。當我們添加一個具有幾種樣式的div時，問題就出現了：

（添加一個body標籤來模擬我們正在做的事情，所以你可以在IE中測試，但是記住我們正在使用C＃/ .Net/VS）

<BODY contentEditable="true"> 
    <DIV class="intro" style="border: 1px solid blue; width=100%;"> 
    <P>My Intro</P> 
    </DIV> 
    <P>Other Text</P> 
</BODY>

有兩件事是不對的。

The first click by the user selects the div。我們希望點擊直接進入文本，並且絕不讓用戶看到調整大小手柄。
如果用戶將光標放在其他文本中，然後嘗試使用鍵盤移動到div文本，則會阻止它們。當你在外面移動時，div被視爲一個角色。

所以，有效的是，有什麼辦法讓div的行爲像只是背景裝飾，但它周圍的一切仍然是可編輯的？這個html完全是內部的，所以我們可以用它來做任何事情。所以div本身並不重要。重要的是，我們：

蘊含多種P或其他標記
顯示用戶在視覺上所有包含P或其他標記是一個組的一部分，就像當前的div邊框&背景色造型現在完成。

This SO question讓我擔心，我想要的東西不可能與我們目前的設置，但我要求幫助任何其他人在類似問題上遇到困難。我會添加一些我們在一瞬間想到的不完美的解決方案。

可能與否，感謝您的任何想法。

來源

2010-02-12 WillfulWizard

偏溶液：內部元件上重新設置的含div來CONTENTEDITABLE = false，則真實的，像這樣：

<BODY contentEditable="true"> 
    <DIV class="intro" contentEditable="false" style="border: 1px solid blue; width=100%;"> 
    <P contentEditable="true">My Intro</P> 
    </DIV> 
    <P>Other Text</P> 
</BODY>

這可能解決問題1（用戶選擇DIV），但確實約問題沒有2.

來源

2010-02-12 19:05:00 WillfulWizard

-1

由於HTML是內置的，不需要玩什麼都不錯，只是有一個表代表的區域，而不是一個div：

<table class="intro"> 
    <tbody> 
    <tr> 
     <td> 
     Intro 
     </td> 
    </tr> 
    </tbody> 
</table>

這個S olves這兩個問題，但顯着複雜的編輯或解析代碼。我們更喜歡更清潔的解決方案。

來源

2010-02-12 19:09:19 WillfulWizard

使用mshtml設置contentEditable，防止選擇div

回答

相關問題