获取contenteditable div的当前行？

Question

获取contenteditable div的当前行？

5

我查阅了资料，并了解到在div contenteditable中没有找到当前行的方法，因此我正在尝试编写一个脚本以最佳估计当前行。

var curLine = 1;
var curColumn = 1;

$(".editable").onkeydown = function(e) {
    var keyCode = e.keyCode || e.which;

    switch( keyCode ) {
        case 13:
            console.log("Enter; on line: " + curLine);
            curLine++;
            break;

        case 8:
            if( /* current line has a text length of 0 */ ) {
                console.log("Previous line prepended; previous enter reversed; on line: " + curLine);
                do {
                    curLine--;
                } while( curLine > 0 );
            }
            // } else if( /* single digit removed */ ) {
                // console.log("Bit prepended");
            // }
            break;
    }
};

所以，正如您所看到的，我有几个问题。这段代码：if( /* 当前行的文本长度为0 */ )我似乎无法针对当前行并检查其字符串长度是否为0。此外，我的do...while语句不起作用，如果我一遍又一遍地在第一行上按退格键，它会变成负数（当应该保持在1 [> 0]）。非常感谢任何帮助。

- Jace Cotton

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Hanlet Escaño · Answer 1

这在Chrome中对我有效。现在将在其他浏览器中进行测试：

$(".editable").on("keyup", function(keyCode){
    var linesCount = $(".editable div").length + 1;
    $("#linesCount").html(linesCount + " lines.");
    return linesCount;
});

对于每一行，可编辑的 div 将创建一个新的 div 子元素。如果您计算这些 div 元素，您将得到总行数。

http://jsfiddle.net/hescano/PypeD/

编辑：对于FF，这实际上会产生<br>标签。您可以计算这些标签。

FF: http://jsfiddle.net/PypeD/1/