如何在网页上加载此内容后才能显示内容

How I can show content only after loading this content on a web page?

本文关键字：显示 网页 加载      更新时间：2023-09-26

我是一个网络开发新手，我有一个我解决不了的问题。

问题:我需要在加载内容后显示内容。

## file.js ##
//on click this code run!
//and after click i see web site load content
var toInsert = $('<div class="togllecomposition tg'+number+'">'
                                <div class="infoclip">'+info+'</div>'
                                <iframe width="420" height="315" src="'+clip+'" frameborder="0" allowfullscreen></iframe>'
                                <div class="comments">'
                                    <div class="commentlabel">Комментарии:</div>'
                                    <div class="comment">'
                                        <div id="hypercomments_widget'+id_composition+'"></div>'
                                            ' + _hcwp.push({widget:"Stream", widget_id: ID, xid: id_composition, append:"#hypercomments_widget"+id_composition, hc_disabled: 1}) +''
                                    </div>'
                                </div>'
                            </div>');
//this didn't work
$(toInsert).load(function() {
     $(".composition".concat(number)).after(toInsert); 
 });

// this work but with lags because content in process of loading
 $(".composition".concat(number)).after(toInsert);

我该如何解决这个问题?

load()事件是危险且模棱两可的，因为您正在同时侦听加载事件和加载ajax内容。请试试这个:

  var toInsert = $('video from youtube');
  $(toInsert).on("load", function() {
      $(".composition"+concat(number)).after(toInsert); 
  });

你可以用另一种方式使用deferred: 

  $(toInsert).load('url-to-video', function(response, status, xhr ) {
       console.log(response, status, xhr );
  });

这是两种不同的方法。不要把两者混在一起!

<标题>编辑

查看OP的编辑，我看到一个可以侦听的iframe，而不是DOM元素。

  toInsert.find('iframe').on("load", function() {
      $(".composition".concat(number)).after(toInsert); 
  });

这是你的解释，因为你不必使用load()方法来监听加载事件:

http://api.jquery.com/load/

相关文章：