ms-office – 在textarea中获取和设置文本选择

2019年7月21日 248次阅读

我想创建一个textarea,用户可以选择文本的一部分,我会根据他们的选择做出反应.所以我需要

1)获取选择文本的开始和结束位置

2)获取焦点的位置,如果它在textarea中并且没有选择

似乎这样做的功能与探索者不同.那么有谁能告诉我在Office加载项中这样做的方法是什么？

我尝试了以下两种方式(即,在myTextarea中选择文本的一部分,单击按钮,然后调试代码),它们似乎不是正确的功能.

(function() {
    "use strict";

    Office.initialize = function(reason) {
        $(document).ready(function() {
            app.initialize();
            $('#button').click(showSelection);
        });
    };

    function showSelection() {
        // way 1
        console.log(document.selection); // undefined
        document.getElementById("myTextarea").focus();
        var sel = document.selection.createRange(); // Uncaught TypeError: Cannot read property 'createRange' of undefined
        selectedText = sel.text;
        // way 2 
        console.log(document.getElementById("myTextarea").selectionstart); // undefined
        console.log(document.getElementById("myTextarea").selectionend); // undefined
    }
})();

另外,如果有人也可以通过代码告诉我如何实现以下内容,那就太棒了：

1)从开始和结束位置选择文本的一部分

2)将焦点设置在textarea的某个位置

编辑1：

我刚刚在Excel加载项中尝试了window.getSelection()：

function showselection() {
    var a = window.getSelection();
    var b = window.getSelection().toString();
    var c = window.getSelection().getRangeAt(0);
}

在textarea中选择文本并单击按钮后,我逐步调试：第一行创建了a = Selection {anchorNode：null,anchorOffset：0,focusNode：null,focusOffset：0,是…;第二行返回“”,第三行出错了Home.js：19 Uncaught IndexSizeError：无法在’Selection’上执行’getRangeAt’：0不是有效索引.看起来选择还没有被成功抓住……

这是没有Excel加载项框架的JSBin,它返回与上面几乎相同的结果.

最佳答案 使用JQuery.

例如,以下两行获得插入位置：

function showselection() {
    console.log($('#myTextarea')[0].selectionStart);
    console.log($('#myTextarea')[0].selectionEnd);
}

有一些插件：

https://github.com/localhost/jquery-fieldselection

http://madapaja.github.io/jquery.selection/

第二个有几个带按钮的短样本(我们可能会失去选择).您可以使用他们的API,也可以查看他们的代码以查看他们调用的JQuery函数.

点赞