javascript - 将文本区域句子拆分为数组并找出在 keyup() 上更改的句子

Question

我有一个包含以下内容的文本区域:

<textarea id="text">
Hello! Who am I? This is the third sentence. This, is another sentence.
</textarea>

因为它是一个文本区域，所以它可以被聚焦。我正在尝试找到一种方法:

1. 将文本区域内的所有句子分隔成一个 javascript 数组。我尝试了一种 $('#text').val().split() 方法，但在我的示例中有不止一个句子分隔符。

2. 我还需要知道光标当前位于哪个句子中。

为什么，你可能会问？当用户更改内容时，我需要处理(使用按字符收费的付费 API)句子。如果我只对第2句做了一个小改动，为什么还要提交第1、3、4句？只提交第二个当然要便宜得多。

正如我之前所说，如果人们只使用点来分隔句子，那么 .split() 方法将是完美的，但还应考虑其他字符 (!?.) --关于第二点，我找到了一个函数来找到de caret位置:

function doGetCaretPosition (ctrl) {
    var CaretPos = 0;
    if (document.selection) {
        ctrl.focus ();
        var Sel = document.selection.createRange ();
        Sel.moveStart ('character', -ctrl.value.length);
        CaretPos = Sel.text.length;
    } else if (ctrl.selectionStart || ctrl.selectionStart == '0') {
        CaretPos = ctrl.selectionStart;
    }
    return (CaretPos);
}

问题来了，position是怎么帮我找到句号的？欢迎所有想法!

Answer 1

我能看到的最简单的方法是像你提到的那样拆分()str。根据我的理解(并没有找到对此的任何引用)，jQuery 实际上没有 split() 函数，但是:

var str = $('#text').val();
var sentences = str.split(/[.|!|?]\s/gi);

正如您所见，javascript 的 split 函数允许使用正则表达式。然而，正则表达式并不完美(已经晚了，明天我会考虑得到一个更好的)。

一旦你有了句子，只需计算每个字符串的长度，直到你得到插入符号的位置。所以得到第一句的长度，= 是否比插入符号位置大，如果不是，则得到第二个字符串 + 第一个字符串的长度，是 = 还是更大。如果它等于或更大，那么这就是你所在的句子，你使用的索引就是句子编号。