将iframe和图像注入html并等待onload事件

时间:2014-01-16 07:22:45

标签: jquery dom-manipulation

我在某些ajax成功事件中有来自服务器的一些字符串:
我想在</body>之前注入波纹管标签并等到 加载。
他们都加载后我想提醒一些事情

...
,
success : function(data){
    var iframe = "<iframe src='http://blablabla.com'></iframe>";// came as data.iframe
    var image = "<img src='http://blablabla.com' />";//came as data.image
    // how do i inject it to html syncly 
    alert("both iframe an image loaded completely");
}

我可以使用Jquery或native。

感谢

1 个答案:

答案 0 :(得分:0)

你可以这样做;

<强> HTML:

<button id='load'>Load image and iframe</button><br />

<强> JS:

$(function(){
    $('#load').on('click', function(){
        var obj=$('<iframe/>', {
            id:'iframe_google',
            src:'http://blablabla.com',
            style:'display:none;width:400px;height:400px',
            load:function(){
                $(this).show();
                var imgPaht = "http://blablabla.com";
                $('<img src="'+ imgPaht +'">').load(function() {
                  $(this).width(1000).height(1000).appendTo('body');
                    alert("Iframe and image loaded");
                })

            }
        });
        $('body').append(obj);    
    });
});

我更新了网址并做了一个例子。

您可以看到工作演示here