2016-11-23 220 views
2

查看下面的代码片段。我希望iframe中的输出文本显示在#source div中。我很努力,并对任何想法表示感谢。如何将iframe中的输出文本复制到div? (剧本写道: “能看到的文字!” 在DIV #show如果格#sourcediv包含 “文本”,否则 “不能见文!”。)记住如何将iframe内容复制到div?

<html> 
 
<body> 
 

 
<div id="source"></div> 
 
<div id="show"></div> 
 

 
<script> 
 
if (document.getElementById('source').innerHTML.indexOf("Text") != -1) 
 
{document.getElementById('show').innerHTML="Can see text!";} 
 
else{document.getElementById('show').innerHTML="Cannot see text!";} 
 
</script> 
 

 
<iframe id="iframe" src="http://majaulrika.esy.es/text.txt"> 
 

 
</body> 
 
</html>

+1

是iframe的域是一样的您的网站?如果没有,你可以改变iframe的网站内容吗?答案不是,所以你不能。 –

+0

@Mosh Feu iframe的域名与我的网站相同。 – mud

+1

我建议不要使用iframe,这不再是1999年。现在,他们有一个有用的目的,即异步文件上传。由于你标记的PHP,尝试['file_get_contents()'](http://php.net/manual/en/function.file-get-contents.php) – Xorifelse

回答

0

牢记这您IFRAME是为您的网页同一个域

// Get your iframe element 

var iframe = document.getElementById('iframe'); 

// Access contents of it like this 

var iframeContent = iframe.contentWindow.document; 

// Get your div element 

var content = document.getElementById('source'); 

// set contents of this div to iframe's content 

content.innerHTML = iframeContent.innerHTML; 

取决于当你这样做时,它也可能是值得等到了iframe负载:

iframe.onload = function() { /* put the above code here */ } 
+0

感谢您的输入。不幸的是我没有得到它的工作。我把正好在身体标签上方。我究竟做错了什么?谢谢! – mud

0

进一步您comment

一个更好的解决方案,使内容从文件是使用AJAX。

下面是一个在jQuery中使用ajax的简单方法。

$.ajax({ 
    url: 'http://output.jsbin.com/sebusu', 
    success: function(data) { 
    $('#source').html(data); 
    $('#show').text(function(){ 
     if (data.indexOf('Text') != -1) { 
     return 'Can see text!'; 
     } 
     else { 
     return "Can't see text!"; 
     } 
    }); 
    }, 
    error: function(){ 
    console.log(error); 
    } 
}); 
<div id="source"></div> 
<div id="show"></div> 
<script src="https://code.jquery.com/jquery-3.1.0.js"></script> 

Live Demo

再次,你只能为你的网站AJAX调用(有一些exceptions

+0

你的代码工作!但我的目标不是从iframe的源文件读取,而是从iframe中的内容读取。为什么我首先要问,将iframe内容复制到div的方式,是因为我有一个

在iframe中发布我想要的输出,php文件提取所有包含我的搜索词和输出显示在iframe中的行(我想从内容复制iframe一个div)。不要太困惑,我希望! 所以,我的问题仍然存在...(参见下面续续评论) – mud

+0

(续。评论:)基本上,我想要做的是搜索文本文件并获取所有行包含搜索词根据线(S)是什么含有(S)我想不同的结果 例: 文本文件的内容: “A1(在同一行) B1(另一条线) B2(另一行) “ 如果我搜索”A“,我想显示一个文字说”你有1!“如果我搜索”B“,我想显示一个文本字符串,说”嘿,你有1和2! “ 我非常感谢你的所有输入!有任何想法吗? – mud

+0

因此,不要在iframe中打开它,只需使用ajax调用'search.php',获取数据并用此数据写入一些HTML,或者您可以在服务器中创建HTML,并将ajax的回调函数写入DOM 。精明? –