使ContentEditable div只读？

Question

所以我想要一个contenteditable div的功能(通过键盘的文本选择是主要的),但我不想让用户编辑文本 - 我认为它readonly="readonly"会工作,但遗憾的是它没有.

我们知道是否有办法做到这一点？contenteditable div可能有嵌套标签(<p>'s,<h1>'s).

我想避免使用textarea(这就是它的用途),因为它不允许我做其他我需要做的事情.

有没有一个很好的方法来做到这一点没有JavaScript？如果没有,是否有一小段javascript仍然允许复制,突出显示等？

谢谢.

这是一个例子:http://codepen.io/anon/pen/dxeAE

Answer 1

我做了一个jquery解决方案/解决方法.什么是阻止按下键时的默认操作:

$(document).ready(function(){
  $("#editor").on("keypress", function(e) {
      e.preventDefault();
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="editor" contenteditable="">
   <h1>Heading</h1>
   <p>Test</p>
</div>