我需要一个div应该是1.可调整大小和2.可编辑。
并且应该在IE和Chrome中工作。
因此，如果我开始在div中编辑，并且如果我到达该div中的行的末尾，则光标应移动到下一行。我如何实现它。
下面是我尝试的代码，但它确实在IE中工作，但不正确。但它不适用于chrome。任何帮助，将不胜感激。谢谢！
$("#resizable").resizable();#resizable {
width: 500px;
height: 500px;
background: #ccc;
}<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<body contenteditable="false">
<div id="resizable" contenteditable="true"></div>这似乎是一个错误，当div为空时，键入的文本写在第一个“子”中，这是正确的可拖动栏。
正如您在DOM（第二行）中看到的那样：
<div id="resizable" contenteditable="true" class="ui-resizable" style="height: 121px; width: 197px;">
<div class="ui-resizable-handle ui-resizable-e" style="z-index: 90;">THE TYPED TEXT GOES HERE!</div>
<div class="ui-resizable-handle ui-resizable-s" style="z-index: 90;"></div>
<div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 90;"></div>
</div>
无论如何，你可以简单地将一个空的char（ ）放入div中并且它可以工作。请参阅以下代码段：
$( ".resizable" ).resizable();.resizable {
width: 100px;
height: 100px;
background: #ccc;
}
.grid {
float: left;
margin: 0.5em;
}<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div class="grid">
Editable div:
<div class="resizable" contenteditable="true"> </div>
</div>
<div class="grid">
Not editable div:
<div class="resizable" contenteditable="true"></div>
</div>