我有如下内容可编辑的 div。
<div style=" border:solid 1px #D31444" contenteditable="true">12 some text...</div>
我需要的是，当我点击 div 时，所有文本都会自动被选中。请问可以给我解决办法吗？
【问题讨论】：
标签： javascript jquery
试试这个：
<div style="border:solid 1px #D31444"
contenteditable="true"
onclick="document.execCommand('selectAll',false,null)">12 some text...</div>
更新：请注意，document.execCommand 现在是 deprecated，尽管它是 still works。
【讨论】：
focus 事件来完成，因为每当用户尝试单击以定位插入符号时，使用单击事件将突出显示所有内容。
focus 不起作用。绑定到click 事件确实选择了文本：$('.editable').on('click', function () { document.execCommand('selectAll', false, null); });
div 上的 focus 事件的问题在于它无法触发，因为它认为 div 不应该是可编辑的。 DOM 中的可编辑内容在后台用tabindex 标记，因此为了让您的div 接收onfocus 事件，您需要显式声明div 的tabindex 属性。
HTML：
<div style=" border:solid 1px #D31444" contenteditable="true" tabindex="1" onfocus="document.execCommand('selectAll',false,null)" >12 some text...</div>
这应该适用于onfocus。
【讨论】：
setTimeout 用于150 毫秒，这样它就不会选择整个文档。希望对大家有帮助！
<style> 和<script> 部分（或@ 987654336@ & .js pages），就像 jsGods 的意图一样，这不会成为问题；你也不应该需要tabindex。您可以使用类似#myDiv{border:solid 1px #d14;} 或其他样式的普通ol'<div id='myDiv'>&nbsp;</div> 和js myDiv.addEventListener('click', function(e){this.contentEditable = true; this.focus(); document.execCommand('selectAll', false, null);});。 （无论如何都适用于FF）
这样就可以了。计时器适用于 Chrome 和 Safari，因为在这些浏览器中，选择整个元素的本机浏览器行为似乎在焦点事件之后触发，从而覆盖选择代码的效果，除非推迟到焦点事件之后：
var div = document.getElementById("editable");
div.onfocus = function() {
window.setTimeout(function() {
var sel, range;
if (window.getSelection && document.createRange) {
range = document.createRange();
range.selectNodeContents(div);
sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);
} else if (document.body.createTextRange) {
range = document.body.createTextRange();
range.moveToElementText(div);
range.select();
}
}, 1);
};
【讨论】：
preventDefault() 已退出。 stopPropagation() 只是阻止事件传播到下一个目标，这对此没有用。
window.getSelection() 和 document.createRange()，现在都是标准化的，大多数浏览器都支持，但 IE document.body.createTextRange().