如何使用 JavaScript 从 textarea 中获取单击的单词

How to get single clicked word from textarea using JavaScript

是否可以在 IE 和 Firefox 中使用 jquery 或 javascript 从 textarea 中获取点击的单词。目前我正在使用下面的代码,它在 Chrome 中运行良好,但在 IE 和 Firefox 中根本不起作用。

<body>
<label for="result" style="display: none">Text</label>
<textarea id="result" rows="30" cols="100"></textarea>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>

    $("#result").click(function() {
        if($(this).val() !== null && $(this).val() !== ''){
            var selection = window.getSelection();
            selection.modify('extend', 'backward', 'word');
            var end = selection.toString();

            selection.modify('extend', 'forward', 'word');
            var start = selection.toString();
            selection.modify('move', 'forward', 'character');
            var wordInput = end+start;

            console.log(wordInput);
        }
    });
</script>
</body>

预期工作

假设一个带有文本的文本区域:'Hello World'

当我点击 'Hello' 中的任何地方时,它应该打印 'Hello' 而不是整个 textarea 值。 'World' 等也是如此。

IE 错误

SCRIPT438: 对象不支持 属性 或方法 'modify'

有人可以帮帮我吗?谢谢!

我想这段代码可以帮到你。

const getTheWord = (selectionStart, value) => {
  let arr = value.split(" ");
  let sum = 0
  for (let i = 0; i < arr.length; i++) {
    sum += arr[i].length + 1
    if (sum > selectionStart) return arr[i]

  }
}

const myArea = document.getElementById("myArea")
myArea.value = "Hello world!"
myArea.onclick = (e) => {
let i = e.currentTarget.selectionStart
console.log(getTheWord(i, myArea.value))
}
<textarea id="myArea"></textarea>