相关疑难解决方法(0)

Chrome中的输出:

<div id="content" contenteditable="true" style="border:1px solid #000;width:500px;height:40px;">
    hey
    <div>what's up?</div>
<div>
<button id="insert_caret"></button>

我相信FF看起来像这样:

hey
<br />
what's up?

在IE中:

hey
<p>what's up?</p>

不幸的是,没有很好的方法来制作它,以便每个浏览器插入一个<br />而不是div或p-tag,或者至少我在网上找不到任何东西.

无论如何,我现在要做的是,当我按下按钮时,我希望将插入符号设置在文本的末尾,所以它应该看起来像这样:

hey
what's up?|

任何方式这样做,所以它适用于所有浏览器？

例:

$(document).ready(function()
{
    $('#insert_caret').click(function()
    {
        var ele = $('#content');
        var length = ele.html().length;

        ele.focus();

        //set caret -> end pos
     }
 }

我需要contenteditable像在Gmail备注小部件上一样将插入符移动到节点的末尾.

我在StackOverflow上读取了线程,但这些解决方案基于使用输入,它们不适用于contenteditable元素.

问题的旧版本如下,在研究了更多之后,我决定重新解释这个问题.像以前一样的问题是,我需要在没有突出显示文本的情况下关注一个可信的div,直接进行焦点突出显示Chrome中的文本.

我意识到人们通过重置textarea中的插入位置来解决textareas中的这个问题.我怎么能用一个满足的元素来做到这一点？我试过的所有插件只适用于textareas.谢谢.

问题的老措辞:

我有一个我想要关注的可满足的元素,但只是将光标放在元素的前面,而是选择所有内容.

elem.trigger('focus');使用jquery选择chrome中整个元素中的所有文本.Firefox行为正确,将插入符号设置在文本的前面.我怎样才能让Chrome按照我想要的方式行事,或者重点关注的可能不是我想要的.

谢谢大家.

我使用toLowerCase()将内容可编辑div转换为小写.但它也扭转了文本!有人可以告诉我为什么会这样吗？

$(document).ready(function() {
  $('#user').bind('keyup', function() {
    $(this).text($(this).text().toLowerCase());
  });
});

#user {
  background: #f1f1f1;
  padding: 1em;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="user" contenteditable="true"></div>

小提琴: https ://jsfiddle.net/professorsamoff/8zyvc202/3/

蒂姆,谢谢