如何使用javascript从iframe中获取选定的文本？

IT技术 javascript iframe selected
2021-03-14 10:02:05 
<html>
 <body>
  <script type="text/javascript">

   function smth() {

    if (document.getSelection) {
    var str = document.getSelection();
    if (window.RegExp) {
      var regstr = unescape("%20%20%20%20%20");
      var regexp = new RegExp(regstr, "g");
      str = str.replace(regexp, "");
    }
    } else if (document.selection && document.selection.createRange) {
     var range = document.selection.createRange();
     var str = range.text;
    }   

    alert(str);
   }
  </script>   

    <iframe id="my"  width="300" height="225">
   .....some html ....
    </iframe>      

    <a href="#" onclick="smth();">AA</a>
 </body>    
</html>

使用smth函数我可以从某些 div 中获取选定的文本，但它不适用于 iframe。任何想法如何从 iframe 获取选定的文本？

5个回答

文档.getSelection

是放在外层文件上。要在 iframe 中选择文档，您需要抓取内部文档：

var iframe= document.getElementById('my');
var idoc= iframe.contentDocument || iframe.contentWindow.document; // ie compatibility

idoc.getSelection()

但请注意，WebKit 不支持document.getSelection() 或 document.selection。尝试将它替换为window.getSelection()在 Firefox 和 WebKit 中都可以使用的，但返回一个选择对象（一个围绕 Ranges 的集合/包装器），它需要字符串：

var idoc= iframe.contentDocument || iframe.contentWindow.document;
var iwin= iframe.contentWindow || iframe.contentDocument.defaultView;

''+iwin.getSelection()

我不确定这是什么意思：

if (window.RegExp) {
  var regstr = unescape("%20%20%20%20%20");
  var regexp = new RegExp(regstr, "g");
  str = str.replace(regexp, "");
}

RegExp是最早版本的基本 JavaScript；它会一直在那里，你不必去嗅探它。多个空格的 URL 编码是完全没有必要的。你甚至不需要 RegExp 这样的字符串替换可以写成：

str= str.split('     ').join('');
window.getSelection() 返回一个选择对象，而不是一个范围。选择上的 toString 将为您提供选择文本。
2021-04-26 10:02:05
我为 iframe 获取了未定义的 contentWindow。似乎为 iframe 获取窗口的正确方法是使用“window.frames”。window.frames[0].getSelection() 给了我我想要的
2021-05-02 10:02:05
''+是的，是 toString 的惯用语。
2021-05-10 10:02:05
是的，我知道。我正在纠正您将 window.getSelection() 返回的选择对象作为 Range 的一个小错误，但同意您的代码可以工作。
2021-05-12 10:02:05
哦！是的，我明白你的意思。会解决的，ta！
2021-05-12 10:02:05

您需要从 iframe 中的文档/窗口中获取选择。

function getIframeSelectionText(iframe) {
  var win = iframe.contentWindow;
  var doc = win.document;

  if (win.getSelection) {
    return win.getSelection().toString();
  } else if (doc.selection && doc.selection.createRange) {
    return doc.selection.createRange().text;
  }
}

var iframe = document.getElementById("my");
alert(getIframeSelectionText(iframe));

您无法访问iframe来自不同于您的域的域中的数据。这是由于同源策略。

好的，对不起，错误的例子，在 iframe 中我有文本，我使用 iframe 作为 wysiwig 编辑器，所以它不在不同的域中。
2021-04-21 10:02:05

以下代码将返回选定的文本。

function getSelectedText(frameId) { 
    // In ExtJS use: 
    // var frame = Ext.getDom(frameId); 
    var frame = document.getElementById(frameId); 

    var frameWindow = frame && frame.contentWindow; 
    var frameDocument = frameWindow && frameWindow.document; 

    if (frameDocument) { 
        if (frameDocument.getSelection) { 
            // Most browsers 
            return String(frameDocument.getSelection()); 
        } 
        else if (frameDocument.selection) { 
            // Internet Explorer 8 and below 
            return frameDocument.selection.createRange().text; 
        } 
        else if (frameWindow.getSelection) { 
            // Safari 3 
            return String(frameWindow.getSelection()); 
        } 
    } 

    /* Fall-through. This could happen if this function is called 
       on a frame that doesn't exist or that isn't ready yet. */ 
    return ''; 
}

希望这会对某人有所帮助。

在控制台中的 firefox 中：错误：权限被拒绝访问属性“文档””。它在行中：“var frameDocument = [...]”。
2021-04-21 10:02:05

此代码适用于所有现代浏览器：

var iframe = document.getElementById('my');
var idoc = iframe.contentDocument || iframe.contentWindow.document; // ie compatibility
var text = idoc.getSelection().toString();
其它你可能感兴趣的问题
上一篇从出生日期获取年龄 下一篇为什么 Array.forEach 比 Javascript 中的 for() 循环慢？