简体   繁体   English

range.select在IE10上无法正确突出显示文本

[英]range.select fails on IE10 to properly highlight text

I have an application that loops thru a textarea, searching for specific text, highlighting it if found, and prompting the user whether to act upon the found text. 我有一个应用程序,它遍历文本区域,搜索特定的文本,如果找到则突出显示,并提示用户是否对找到的文本采取行动。 This has worked fine on all versions of IE prior to IE10 (the text is highlighted, and the user is prompted). 在IE10之前的所有IE版本上,此方法均能正常工作(突出显示文本,并提示用户)。

With IE10, the range.select will no longer highlight the text, due to what appears to be the CONFIRM prompt. 对于IE10,由于显示为CONFIRM提示,所以range.select将不再突出显示文本。 If CONFIRM is removed, the text is highlighted. 如果删除了CONFIRM,则文本将突出显示。 Also on IE 10, after the last CONFIRM is OK'd, the last instance of the text is then highlighted when the form returns to focus. 同样在IE 10上,在确定最后一个确认后,当表单返回焦点时,文本的最后一个实例将突出显示。

Below is a code snippet that will work demonstrate this, and will work fine under IE 5, 6, 7, 8, 9, but will fail on IE10. 下面是一个代码片段,它将演示这一点,并且将在IE 5、6、7、8、9下正常运行,但在IE10上将失败。 Any help on redesigning or other code alternatives would be greatly appreciated. 在重新设计或其他代码替代方面的任何帮助将不胜感激。 I ONLY need this to work in the IE environment (internal application, limited to IE only use). 我只需要在IE环境(内部应用程序,仅限于IE使用)中工作即可。


<html>
<body>

<form name="theForm">
   <textarea name="message" rows="20" cols="80">NAM/JONES  NAM/SMITH   NAM/BROWN</textarea>
</form>

<script>
   var message = document.theForm.message.value.toUpperCase();
   var range = document.theForm.message.createTextRange();

   for (x=0; x<message.length-1; x++) {
      if (message.substr(x,4) == "NAM/") {
         var strFound=range.findText("NAM/");
         if (strFound) range.select();
         range.collapse(false);
         msg = "Process this name?";
         if (confirm(msg)) {
            // use x.substr to extract name, and do something
         }
      }
   }
</script>

</body>
</html>

I had simmilar problems and i made a demo based on yours and the problematic code we had 我遇到了类似的问题,并根据您的问题和我们有问题的代码制作了一个演示

<?xml version="1.0" encoding="ISO-8859-1" ?>
<html>
<head>
    <title></title>
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
</head>
<body>

    <form name="theForm">
        <input type="text" id="txt" value="1234567890" />
        <span id="selected" />
    </form>

    <script>
        function selectRange(start, end) {
            var range = document.theForm.txt.createTextRange();
            range.moveStart("character", 0 - end);
            range.moveEnd("character", 0 - end);
            range.select();
            // Und dann den neu hinzugekommenen Teil markieren.
            range.moveStart("character", start);
            range.moveEnd("character", end - start);
            range.select();
        }
        function step(x) {
            if (x >= document.theForm.txt.value.length - 2)
                return;
            selectRange(x, x + 2);
            document.getElementById("selected").innerHTML = document.selection.createRange().text;
            window.setTimeout(function () { step(x + 1); }, 1000);
        }
        step(0);
    </script>

</body>
</html>

it turned out that range.select(); 原来是那个range.select(); works again when its happening inside a setTimeout() . 当它发生在setTimeout()时,它将再次工作。

we ended up putting our problematic function into a settimeout completely 我们最终将有问题的功能完全放入了settimeout

this.selectTextRange = function (start, end) {
    window.setTimeout(function() {
        var range = thisControl.textBox.createTextRange();
        // Ganz an den Anfang moven     
        range.moveStart("character", 0 - end);
        range.moveEnd("character", 0 - end);
        range.select();
        // Und dann den neu hinzugekommenen Teil markieren.
        range.moveStart("character", start);
        range.moveEnd("character", end - start);
        range.select();
    }, 0);
};

i hope this helps. 我希望这有帮助。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM