contenteditable點擊元素周圍的任何地方，並在Chrome中選擇它

在Chrome中，我有一個簡單的contenteditable="true" span，如果用戶點擊它周圍的任何地方，光標就會顯示，並且他/她可以開始編輯。這是煩人的B/C我只想要光標出現時，用戶點擊跨度本身，而不是在它之外。contenteditable點擊元素周圍的任何地方，並在Chrome中選擇它

例子：http://jsbin.com/oyamab/edit#javascript,html,live

的Html下面...

<body> 
    <span id="hello" contenteditable="true">Hello World</span> 
</body>

如果您訪問Chrome中的鏈接，點擊任何地方呈現的HTML框（在jsbin最右列），你可以開始編輯。另一方面，在Firefox中，你必須點擊實際的跨度來編輯它（耶！）。

我是否需要將其作爲Chrome瀏覽器接受，或者是否存在黑客行爲？謝謝。

來源

2012-06-04 Ian Davis

我強烈懷疑這只是一個WebKit的事情。你可以解決它雖然通過使只有當它被點擊

演示跨度CONTENTEDITABLE：http://jsfiddle.net/timdown/nV4gp/

HTML：

<body> 
    <span id="hello">Hello World</span> 
</body>

JS：

document.getElementById("hello").onclick = function(evt) { 
    if (!this.isContentEditable) { 
     this.contentEditable = "true"; 
     this.focus(); 
    } 
};

來源

2012-06-05 23:44:28

不幸的是，如果你仍然點擊這是「hello world」的最右側，它觸發了onclick事件並使其成爲一個可信的事件。這裏的截圖：http://i.imgur.com/WcTuZ.png –

@IanDavis：最初不是。如果你確保當用戶點擊其他地方時跨度是不可編輯的，雖然有點不合理，但它很好：http://jsfiddle.net/timdown/nV4gp/2/ –

contenteditable點擊元素周圍的任何地方，並在Chrome中選擇它

回答

相關問題