Internet Explorer 8标准模式(IE8)中的TextRange offsetLeft和offsetTop中断

Question

Internet Explorer 8标准模式(IE8)中的TextRange offsetLeft和offsetTop中断

the*_*oth 9 internet-explorer-8 textrange

当找到文本范围的位置时,我似乎发现了Internet Explorer 8的问题 - 例如当前选择的文本.我还没有找到能在StackOverflow或其他地方找到任何关于此问题的报告.

TextRange.offsetLeft和TextRange.offsetTop报告范围的左上角,在IE8中我看到的所有情况都是粗略正确的,除非范围在IFrame中.当范围在IFrame内时,offsetLeft和offsetTop的值相对于其父级内的IFrame的位置移动负值.(见下面的例子)

此问题仅在以下时间出现:

浏览器是IE8
页面处于标准模式

在以下情况下不会出现此问题:

浏览器是IE7或IE10
页面处于怪异模式

我的问题:

其他人可以证实这个问题还是我疯了？
这是一个已知的问题？
有没有理智的解决方案或解决方案？(一个理智的解决方案是框架中的JS不需要了解其父窗口的任何内容)

谢谢.

问题的一个例子:(参见IE8与IE9的区别)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
        <title>IE8 IFrame Text Range Position Test Page</title>
        <style type="text/css">
            body {
                font-family: Tahoma;
            }
            #target {
                background-color: #CCC;
                position: absolute;
                left: 50px;
                top: 50px;
            }

            #bullsEye {
                position: absolute;
                background-color: red;
                width: 5px;
                height: 5px;
            }

            iframe {
                margin: 10px 75px;
            }
        </style>
        <script type="text/javascript" charset="utf-8">
            function target() {
                var range = document.body.createTextRange();
                range.moveToElementText(document.getElementById('target'));
                range.select();
                var bullsEye = document.createElement('div');
                bullsEye.id = 'bullsEye';
                bullsEye.style.left = range.offsetLeft + 'px';
                bullsEye.style.top = range.offsetTop + 'px';
                document.body.appendChild(bullsEye);
                document.getElementById('output').innerHTML = 'range.offsetLeft = ' + range.offsetLeft + ', range.offsetTop = ' + range.offsetTop;
            }
        </script>
    </head>
    <body>
        <div id="target">Target</div>
        <input type="button" value="Hit Target" onclick="target();"> <span id="output"></span>
        <br><br><br><br><br>
        <script>
            if (window.parent == window) document.write('<iframe src="?tfr" height="150" width="500"></iframe>');
        </script>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

Answer 1

the*_*oth 3

我仍然相信这是 IE8 中的一个错误，但有一个解决方法
在标准模式下使用boundingLeft和boundingRight. 但在怪癖模式下使用offsetLeft和offsetRight

归档时间：	13 年，9 月前
查看次数：	2382 次
最近记录：	13 年，3 月前