Question

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

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

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

这样做的功能似乎与资源管理器不同。那么有谁能告诉我在Office加载项中执行此操作的方法是什么？

我尝试了以下两种方式（即，在myTextarea中选择部分文字，点击button，然后调试代码），它们似乎不是正确的功能。

(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中选择文本并点击button后，我逐步进行了调试：第一行a a = Selection {anchorNode: null, anchorOffset: 0, focusNode: null, focusOffset: 0, is ...;第二行返回""，第三行收到错误Home.js:19 Uncaught IndexSizeError: Failed to execute 'getRangeAt' on 'Selection': 0 is not a valid index.看起来选择未成功捕获...

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

Answer 1

如果所需的选择只是HTML页面中的选定文本（而不是用户在Excel / Word中的选择），那么有一些好的stackoverflow answers about accessing that selection。

Answer 2

使用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函数。

Answer 3

适用于Office的JavaScript API的一个关键功能是它们遵循异步模型（您在上面为showSelection（）编写的代码似乎是同步的）。我建议您阅读Excel和Word JS API概述页面，以了解它们的工作原理。例如，以下是您从选择中获取文字的方式：

Word.run(function (context) {
    var myRange = context.document.getSelection();
    context.load(myRange, 'text');
    return context.sync().then(function () {
        log("Selection contents: " + myRange.text);
    });
})

然后，对于您的问题的其他细节，请按照我的评论中的要求澄清。谢谢！

-Michael（PM for Office加载项）

在textarea

3 个答案: