Internet Explorer getClientRects绝对定位的元素

Question

我目前在IE 11中遇到文本选择问题（尽管在以前的IE中也会发生）。 我的目标是使文本选择在返回给我getClientRects的地方起作用。 我有一个简单的设置。 我有一个容器div，在该div中，我放置了两个跨度：

<div onmouseup="mouseup()" id="container">
    <div class="span1">Span 1</div>
    <div class="span2">Span 2</div>
</div>

两个跨度均绝对位于上/左和下/右角。 容器的高度为100像素；

将鼠标移到该函数上即可运行：

function mouseup(){
    var selectObj = ((window.getSelection)?window.getSelection():document.getSelection());
    alert(selectObj.getRangeAt(0).getClientRects().length);
}

在chrome上，如果您尝试从跨度1到跨度2选择文本，则会提示长度为3，这正是我想要的，因为这让我知道了文本选择的边界框在哪里。 在Internet Explorer上，尽管它始终返回0。如果我仅在单个跨度内选择文本，它将起作用，但是一旦您转到多个，它将​​失败。

这是所有设置的jsFiddle： http : //jsfiddle.net/v6sa71hs/

Answer 1

看来您无法那样做。 如果您改为告诉所有内容浮动，然后将其定位在margin-top / left处，则它将起作用。 这是两个跨度的css

span{
    float: left;
    margin-bottom: -100%;
    margin-right: -100%;
}

更新小提琴： http : //jsfiddle.net/9gemwtc5/