2

如何以编程方式从 A(x1,y1) 选择到 B(x2,y2) ？

x1, y1, x2, y2 是像素坐标。我搜索了很多，在我找到的所有函数中，我们必须指定一个特定的标签，然后它会选择它的内容。

4

2 回答 2

17

您可以在所有浏览器的当前版本中执行此操作。这些浏览器至少具有以下一项：

  • 基于标准的方法，由 Firefox >= 20 实现，来自 CSSOM View 规范：document.caretPositionFromPoint()
  • WebKit 的专有版本相同：document.caretRangeFromPoint().
  • IE 的专有TextRange对象，它有一个moveToPoint()获取像素坐标的方法。moveToPoint()但是，在所有版本的 IE 中都使用的似乎有问题（例如，请参见此处和此处）；我很幸运能够在我使用过的所有文档中工作。

然而，Mozilla 还没有实现这些，Opera 也没有，所以这些浏览器还不能实现。

Firefox 20 及更高版本支持document.caretPositionFromPoint(). Opera 15 支持document.caretRangeFromPoint()

这是一些示例代码。它适用于 IE 5+、2010 年左右开始的 WebKit、Firefox >= 20 和 Opera >= 15。

现场演示：http: //jsfiddle.net/timdown/ABjQP/

代码：

function createSelectionFromPoint(startX, startY, endX, endY) {
    var doc = document;
    var start, end, range = null;
    if (typeof doc.caretPositionFromPoint != "undefined") {
        start = doc.caretPositionFromPoint(startX, startY);
        end = doc.caretPositionFromPoint(endX, endY);
        range = doc.createRange();
        range.setStart(start.offsetNode, start.offset);
        range.setEnd(end.offsetNode, end.offset);
    } else if (typeof doc.caretRangeFromPoint != "undefined") {
        start = doc.caretRangeFromPoint(startX, startY);
        end = doc.caretRangeFromPoint(endX, endY);
        range = doc.createRange();
        range.setStart(start.startContainer, start.startOffset);
        range.setEnd(end.startContainer, end.startOffset);
    }
    if (range !== null && typeof window.getSelection != "undefined") {
        var sel = window.getSelection();
        sel.removeAllRanges();
        sel.addRange(range);
    } else if (typeof doc.body.createTextRange != "undefined") {
        range = doc.body.createTextRange();
        range.moveToPoint(startX, startY);
        var endRange = range.duplicate();
        endRange.moveToPoint(endX, endY);
        range.setEndPoint("EndToEnd", endRange);
        range.select();
    }
}
于 2012-06-25T14:34:52.613 回答
1

对于 Firefox 或 Opera，有一些解决方法。这将插入符号设置在元素的第一个位置：

console.log("moz or opera doesn't support caret by position so we have a workaround");
var range = doc.createRange();
var element = doc.elementFromPoint(startX, startY);
range.setStart(element, 0);
于 2012-10-22T06:44:37.840 回答