如何在Jquery .html中添加微调器(<object data =“http://example.com”>)

时间:2016-06-06 21:48:24

标签: javascript jquery html

我使用Jquery加载外部网站(我自己的)。

<div id="siteloader"><center>
<img style="width: 100px; height: 100px;" src="http://seafood.greenpeaceusa.org/images/spinner.gif" alt="Mountain View" /></center></div>
​
    <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
    <script>
$( document ).ready(function() {
   $("#siteloader").html('<object "width:100%; height:2000px; data="http://example.com/findex.php">');
});
</scirpt>

正如你现在所看到的,我正在div中加载微调器gif并用外部网站html替换div的内容,但它在下载网站的时候正在替换它我可以让它等待直到网站下载后才更换html?

顺便说一句,.load方法由于某些原因不能为我工作= \

1 个答案:

答案 0 :(得分:0)

您的object会替换document.ready中div的内容。它应该在加载对象时完成。

<script>
$( document ).ready(function() {
   //$("#siteloader").html('<object "width:100%; height:2000px; data="http://example.com/findex.php">'); syntax errors here
   //this doesn't work as well
   $('<object "width:100%; height:2000px; data="http://example.com/findex.php">')
      .load(function(){
          $("#siteloader").empty().append(this);
      });
});
</script>

修正了工作脚本:

    <script>
$( document ).ready(function() {
    /*
    //wrong again spinner disappear before object loaded
    $('<object style="width:100%; height:400px; display:none;" data="http://www.w3schools.com/tags/helloworld.swf" />')
        .appendTo($("#siteloader"))
        .after(function () {
          console.log('loaded');
          $(this).show().siblings().each(function () {
              $(this).remove();
          });
      });
    */
        //and this work for sure
        var obj = document.createElement('object');
        obj.onload = function () {
            console.log('loaded');
            $(this).css({ width: '100%', height: '400px' }).show()
                .siblings().each(function () {
                    $(this).remove();
                });
        };
        obj.data = 'json.php';
        $(obj).appendTo('#siteloader');

});
    </script>

我希望它也适用于您的数据。这看起来很丑陋(混合jquery和纯JS),但这是使它工作的唯一方法。 $(obj).appendTo('#siteloader')会触发负载 以防万一,PHP使用:

<?php
usleep(10000000);
echo '{"name":"qwas","qty":10,"curr":"'.date('h:i:s').'"}';
?>