contenteditable divs在Opera中有一個奇怪的行爲焦點

我決定使用div而不是輸入。這是一個代碼，很簡單<div contenteditable="true"></div>所以，看看jsfiddle：http://jsfiddle.net/QkfKk/contenteditable divs在Opera中有一個奇怪的行爲焦點

只爲jsfiddle我已經標記了第一行的區域。在Opera中，我必須直接點擊標記區域來關注div。另外，我可以通過在那裏的任何空間雙擊來關注它。但是，該點擊不應該是雙倍的。我希望我解釋正確。在Chrome和任何其他瀏覽器中，我只需點擊一下鼠標即可將其聚焦。在標記區域或非標記區域，無論如何。我相信這是正確的行爲。

來源

2013-04-26 Novelist

+1爲提供良好的小提琴。儘管如此，最簡單的解決方案就是不在Opera中測試。它幾乎沒有1-2％的市場份額，其用戶大多是想要摺頁的時尚人士*聳肩*''。不，但真的，因爲Opera只是過渡到Blink，我預計在未來幾個月會出現各種奇怪的錯誤。 – 2013-04-26 21:01:40

雙擊工作的原因是雙擊意味着全選。嘗試輸入一些單詞並雙擊div的剩餘空間來測試。我會說這是一個瀏覽器實現問題，我們很難做到這一點。 – Antony 2013-04-27 04:23:40

@Antony，是的，謝謝。順便說一句，這個選擇會忽略像'«，\ *（「和類似的符號，這很有趣，但是不免有幫助。 – Novelist 2013-04-27 17:12:39

我解決了它。該解決方案有一些缺陷，但這對我來說已經足夠了。當我點擊非標記區域焦點事件觸發器時，無論如何。所以，我決定將光標位置設置爲觸發焦點事件的最後可能位置。這裏是代碼：

var range = document.createRange(); 
var selection = getSelection(); 
var children = this.childNodes; 
var last = children[children.length-1]; 
if (last.textContent.length) { 
    range.setStart(last,last.textContent.length); 
} else { 
    range.setStart(this,0); 
} 
range.collapse(true); 
selection.removeAllRanges(); 
selection.addRange(range);

而這個結合上focus，僅此而已。解決方案確實很簡單，但效果很好。

小提琴：http://jsfiddle.net/QkfKk/7/

來源

2013-04-28 18:07:20 Novelist

contenteditable divs在Opera中有一個奇怪的行爲焦點

回答

相關問題