通过Javascript计算HTML中的开始和结束选择索引

时间:2010-09-14 09:03:53

标签: javascript jquery html

如何在contentEditable'div'中的IE以外的浏览器中获取开始和结束选择索引。对于Ex。,IE有以下方法。

var oSelection;
var oTxtRange;
var units = -100000;
var iStartIndex = -1, iEndIndex = -1;

if(document.selection)      // IE..
{
  oSelection = document.selection;
  oTxtRange = oSelection.createRange();

  if(oTxtRange)
  {
    iStartIndex = oTxtRange.moveStart('character',units);
    iEndIndex = oTxtRange.moveEnd('character',units);
    iStartIndex *= -1;
    iEndIndex *= -1;
  }
}

据我所知,上述方法不是W3C标准。我已经阅读了选择和范围对象的W3C文档,但仍然无法帮助找到Chrome和FireFox的解决方案。 JQuery中的解决方案也很受欢迎。

提前致谢: - )

1 个答案:

答案 0 :(得分:0)

您可以在非IE浏览器中执行以下操作。它返回页面的可见正文文本中选择边界的偏移量,就像IE版本一样,但我不确定这些数字的用途是什么。

function getBodyTextOffset(node, offset) {
    var sel = window.getSelection();
    var range = document.createRange();
    range.selectNodeContents(document.body);
    range.setEnd(node, offset);
    sel.removeAllRanges();
    sel.addRange(range);
    return sel.toString().length;
}

function getSelectionOffsets() {
    var sel, range;
    var start = 0, end = 0;
    if (window.getSelection) {
        sel = window.getSelection();
        if (sel.rangeCount) {
            range = sel.getRangeAt(sel.rangeCount - 1);
            start = getBodyTextOffset(range.startContainer, range.startOffset);
            end = getBodyTextOffset(range.endContainer, range.endOffset);
            sel.removeAllRanges();
            sel.addRange(range);
            alert(start + ", " + end);
        }
    } else if (document.selection) {
        // IE stuff here
    }
    return {
        start: start,
        end: end
    };
}