在contenteditable true div内设置插入符后面的contenteditable false span div

Question

是否有可能在满足contenteditable真正div的contenteditable false后面设置插入符/光标在span后面？

实施例：

$('#straightHtml').html('<p><span contenteditable="false">test</span></p>')

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<div id='straightHtml' contenteditable="true"> 
 
</div>

Answer 1

只需添加一个<br>中包含contenteditable =假跨度后面。

$('#straightHtml').html('<p><span contenteditable="false">test</span><br></p>') 

有一个尝试：

$('#straightHtml').html('<p><span contenteditable="false">test</span><br></p>')

* { 
 
    border: 1px solid black; 
 
} 
 

 
span { 
 
    width: auto; 
 
    display: inline-block; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<div id='straightHtml' contenteditable="true"> 
 
</div>