Javascript 如何检测光标在哪一行？_Javascript_Jquery

Javascript 如何检测光标在哪一行？

javascript jquery

Javascript 如何检测光标在哪一行？,javascript,jquery,Javascript,Jquery,我知道，这可能会变得非常复杂，也许几乎不可能，但也许你们中有人知道这条路：我现在正在为一种自创的简单语言（5个关键词，WUHA！）编写一个编辑器，它已经运行得很好了。但这不是重点，现在我想为它创建一个带有语法高亮显示的编辑器。是的，如果可能的话，我希望它在线，所以我唯一的机会就是JavaScript/jQuery 我还没有太多的代码，到目前为止我只得到了以下内容： <!DOCTYPE html> <html> <head> <t

我知道，这可能会变得非常复杂，也许几乎不可能，但也许你们中有人知道这条路：

我现在正在为一种自创的简单语言（5个关键词，WUHA！）编写一个编辑器，它已经运行得很好了。但这不是重点，现在我想为它创建一个带有语法高亮显示的编辑器。是的，如果可能的话，我希望它在线，所以我唯一的机会就是JavaScript/jQuery

我还没有太多的代码，到目前为止我只得到了以下内容：

<!DOCTYPE html>
    <html>
    <head>
    <title>Kevcode Editor</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery.js"></script>
    <script>
    $(document).ready(function(){
        var keywords = ["KEYWORD2", "KEYWORD3", "KEYWORD4"];

        $("#editor").keydown(function(e) {
            if(e.keyCode == 13) {
               //GET THE LINE HERE
               //mark keywords here
            }
        });

    });
</script>
</head>
<body style="background-color: grey;">
<label for="editor"><textarea id="editor" style="width: 1200px; height: 800px;"></textarea></label>
</body>
</html>


Kevcode编辑器
$（文档）.ready（函数（）{
var关键字=[“关键字2”、“关键字3”、“关键字4”]；
$（“#编辑器”）.keydown（函数（e）{
如果（e.keyCode==13）{
//在这里接电话
//在这里标记关键字
}
});
});

因此，我的计划是创建一个

textarea

，如果我按Enter键（由keycode13表示），我将运行一个脚本，检查每一行并重新输入关键字。但后来我认为检查整个脚本将是一种巨大的资源浪费。当然，脚本不会太长，有5个关键字，但是如果我添加越来越多的关键字，检查整个代码会很糟糕。所以我想，只要检查一下我更改内容的当前行，就可以节省很多时间。但我如何实现这样的逻辑呢？如何告诉jQuery光标当前在哪一行

对不起，如果我解释的不清楚，如果你有任何问题，请问，我会尽可能多的信息

哦，请不要给我完整的解决方案。我这样做是为了训练

这将帮助您在文本区域中查找光标位置

javascript:

var cursorPosition = $('#myTextarea').prop("selectionStart");

Html:

试试这个：

<textarea onkeyup="getLineNumber(this, document.getElementById('lineNo'));" onmouseup="this.onkeyup();"></textarea>
<div id="lineNo"></div>

<script>

function getLineNumber(textarea, indicator) {

    indicator.innerHTML = textarea.value.substr(0, textarea.selectionStart).split("\n").length;
}

</script>


函数getLineNumber（文本区域，指示器）{
indicator.innerHTML=textarea.value.substr（0，textarea.selectionStart）.split（“\n”）.length；
}

您将无法逐行更改颜色。大多数语法突出显示工具在后台使用假的

textarea

，并将输出写入可以设置样式的HTML元素。因此我的方法基本上无法工作，我必须尝试其他方法？是的。读一读开源项目本身就行了不，这不起作用，它计算了我输入的所有字符，而不仅仅是新行。@YUNOWORK你能做一件事吗。将代码放入mouseenter函数中，并检查一次。

<textarea onkeyup="getLineNumber(this, document.getElementById('lineNo'));" onmouseup="this.onkeyup();"></textarea>
<div id="lineNo"></div>

<script>

function getLineNumber(textarea, indicator) {

    indicator.innerHTML = textarea.value.substr(0, textarea.selectionStart).split("\n").length;
}

</script>