2016-09-25 5 views
0

Я пытаюсь поместить некоторый HTML-код в iframe для представления данных. Everythink отлично работает, но когда я хочу поместить любой скрипт java в iframe, результата нет. Кажется, что iframe не видит локальный javascript.Вставить локальный javasscript в iframe html

Вот код:

<html> 
    <head> 
     <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> 
     <script src="testJSON.js"></script> 
    </head> 
    <body> 
    <iframe id="frame"></iframe> 
    <p id="demo"></p> 
     <script src="names.js"></script> 
     <script type="text/javascript"> 
       $("#frame").attr(
      "src", "data:text/html;charset=utf-8," + 
      "<html><head>"+ 
      "<script src='jquery.min.js'><"+"/script>"+ 
      "<script src='testJSON.js'><"+"/script></head>"+ 
      "<body><p id='demo'></p>"+ 
      "<script src='name.js'><"+"/script>"+ 
      "<h1>Test</h1>"+ 
      "</body></html>" 
     ); 
     </script> 
</body> 
</html> 

testJSON.js:

var dane = '{ "names" : [' + 
'{ "firstName":"Ana" , "lastName":"Doe" },' + 
'{ "firstName":"Bill" , "lastName":"Smith" },' + 
'{ "firstName":"Dory" , "lastName":"Jones" } ]}'; 

names.js:

var nameID =function() { 
    return 2; 
}; 

obj = JSON.parse(dane); 
document.getElementById("demo").innerHTML = 
obj.names[nameID()].firstName + " " + obj.names[nameID()].lastName; 

Кто-нибудь есть решение этой проблемы?

Спасибо

+0

прошла ли эта страница локально, или находится на сервере сервера, локальной или веб-страницы? – Teemu

+0

В качестве примечания, если вам не нужно поддерживать IE, вы должны использовать атрибут [srcdoc] (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr -srcdoc) –

ответ

1

Я предполагаю, что DataURIs не может содержать внешние сценарии по соображениям безопасности, но я не могу найти дубликат SO пост, что подтверждает это. В любом случае, document.write html и script в рамку. Это работает

$("#frame")[0].document.contentDocument.write(
     "<html><head>"+ 
     "<script src='jquery.min.js'><\/script>"+ 
     "<script src='testJSON.js'><\/script></head>"+ 
     "<body><p id='demo'></p>"+ 
     "<script src='name.js'><\/script>"+ 
     "<h1>Test</h1>"+ 
     "</body></html>" 
    ); 
$("#frame")[0].contentDocument.close(); 

вам может понадобиться, чтобы полностью квалифицировать адреса из внешних файлов

+0

Большое спасибо. Я изменил $ ("# frame"). Attr (в: $ ("# frame") [0] .contentDocument.write, и он отлично подходит для меня. – doxy

0

Вот проблема гонки: Youre пытается получить доступ к JSON, перед загрузкой IFrame, таким образом, датчанин будет неопределенным. Используйте прослушиватели или добрый обратный вызов.

Обратный звонок:

//in your page: 
function parse(json){ 
//do sth with json 
} 
//in the iframe: 
parse("{}"); 

Слушателей:

document.getElementsByTagName("iframe")[0].onload=function(){ 
//you parsing js 
}; 
Смежные вопросы