1
+ <!DOCTYPE html>
2
+ < html >
3
+ < head >
4
+ < meta charset ="utf-8 ">
5
+ < meta http-equiv ="X-UA-Compatible " content ="IE=edge ">
6
+ < title > iframe</ title >
7
+ < script src ="jquery.min.js "> </ script >
8
+ < script >
9
+ // var url = "https://appcenter-staging.html5tools-software.intel.com/Account/xdklogin.aspx?xdk=true&xdkvariant=xdk&xdkversion=release-2014-ww51";
10
+ // var url = '#';
11
+ var url = "http://www.baidu.com/" ;
12
+ function createIframejq ( ) {
13
+ var html = '<iframe style="width:100%;height:100%;"></iframe>' ;
14
+ var $out = $ ( '#out' ) . append ( html ) ;
15
+ var $iframe = $out . find ( 'iframe' ) ;
16
+ $iframe . hide ( ) ;
17
+
18
+ $iframe [ 0 ] . onload = function ( ) {
19
+ console . log ( 'onload' ) ;
20
+ } ;
21
+
22
+ $iframe . on ( 'load' , function ( ) {
23
+ console . log ( 'addEventListener(load)' ) ;
24
+ $iframe . show ( ) ;
25
+ } , false ) ;
26
+
27
+ $iframe . attr ( 'src' , url ) ;
28
+ }
29
+ function createIframe ( ) {
30
+ var html = '<iframe style="width:100%;height:100%;"></iframe>' ;
31
+ document . getElementById ( 'out' ) . innerHTML = html ;
32
+ var $iframe = document . getElementsByTagName ( 'iframe' ) [ 0 ] ;
33
+ $iframe . style . display = 'none' ;
34
+
35
+ $iframe . onload = function ( ) {
36
+ console . log ( 'onload' ) ;
37
+ } ;
38
+
39
+ $iframe . addEventListener ( 'load' , function ( ) {
40
+ console . log ( 'addEventListener(load)' ) ;
41
+ $iframe . style . display = 'block' ;
42
+ } , false ) ;
43
+
44
+ $iframe . src = url ;
45
+ }
46
+ </ script >
47
+ </ head >
48
+ < body style ="width:100%;height:100%;margin:0px; ">
49
+ < button onclick ="createIframe() "> Create</ button >
50
+ < button onclick ="createIframe() "> CreateJQ</ button >
51
+ < div id ="out "> </ div >
52
+ </ body >
53
+ </ html >
0 commit comments