Question

我试着解释我的问题。

我有<div contenteditable="true" id="my_editeur>，我在其中定义了一个按键“事件”，允许我在用户点击“输入”时添加“p”。

它运行良好，但我想在这个新的'p'元素上定义光标，因为目前我的光标停留在第一个'p'元素上。

我曾尝试使用jquery焦点函数，但似乎我们不能将此函数用于'p'元素。

你知道如何解决我的问题吗？

非常感谢你的帮助。

我的代码：

$('#my_editeur').keypress(function(e){
        if(e.keyCode == 13) {
            e.preventDefault();
            $(this).append('<p ><br /></p>');          
        }
    });

Answer 1

不确定这是否有效，但您是否尝试向tabindex="0"添加<p>？这意味着它可以成为大多数浏览器的焦点。

Answer 2

创建段落时，请包含不间断的空格。

var newP = $("<p>&#160;</p>").get(0);

对于Firefox和符合标准的浏览器，

var rng = document.createRange();
rng.selectNodeContents(  newP  );
var sel = document.defaultView.getSelection();
sel.removeAllRanges();                          
sel.addRange(rng);

对于IE，

var rng = document.body.createTextRange();
rng.moveToElementText(  newP );
rng.select();

Answer 3

如果我错了，请更正我，但您希望能够将文字输入<p>元素，就好像它是<input>或<textarea>一样？如果是这样，这是我放在一起的黑客攻击。它显然不完整，只是一个概念证明。

<!doctype html>
<html>
  <head>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript">

      $(document).ready(
        function(){

          $('#textbox').click(
            function(){
              $(this).css('border','1px solid #f00');
              $('#mytext').focus();
            }
          );

          $('#mytext').keypress(
            function(event){

              if(event.keyCode==13){
                $('#textbox').append('<br>');
              }
              else{
                $('#textbox').append(String.fromCharCode(event.which));
              }
            }
          );

        }
      );

    </script>
    <style type="text/css">

      #mytext{
        position: fixed;
        top: -100px;
        left: 0;
      }

    </style>
  </head>
  <body>
    <input type="text" id="mytext" tabindex="0">
    <div id="textbox"><span>hello</span></div>
  </body>
</html>

您应该可以点击显示“hello”的<div>并在其中输入更多文字。

Answer 4

您可以将选择设置为新＆lt; p＆gt;内的DOMRange吗？？我想做windows.getSelection（）来检索当前的DOMRange并更改它的startContainer，endContainer，startOffset，endOffset。

在元素上定义光标

4 个答案: