Question

想知道是否有人可以提供帮助，因为没有人在那里解决了这个问题！

你如何等待一个动态加载的元素（例如另一个.html页面的特定div）首先被完全加载，这样你才可以，然后才能触发一个函数？

.load显然不会像OP所指出的那样工作 post.

有什么想法吗？

非常感谢！

更新：更多信息：我正在使用.load从另一个页面加载div元素，其中包含供Galleria使用的数据（使用.load的回调执行）。我目前正在使用setTimeout来确保加载div，以便Galleria不会加载太快而空。但我不喜欢这个setTimeout业务，它太过于拼凑而成的解决方案。

要加载的Div：

<div id="source1" class="container">
 <div class="thumbnails"><a href="images/gallery/recent/7.jpg"><img src="images/navigation/recent/7.jpg"/></a></div>
 <div class="thumbnails"><a href="images/gallery/recent/6.jpg"><img src="images/navigation/recent/6.jpg"/></a></div>
 <div class="thumbnails"><a href="images/gallery/recent/5.jpg"><img src="images/navigation/recent/5.jpg"/></a></div>
 <div class="thumbnails"><a href="images/gallery/recent/4.jpg"><img src="images/navigation/recent/4.jpg"/></a></div>
</div>
<div id="source2" class="container">
 <div class="thumbnails"><a href="images/gallery/recent/3.jpg"><img src="images/navigation/recent/3.jpg"/></a></div>
 <div class="thumbnails"><a href="images/gallery/recent/2.jpg"><img src="images/navigation/recent/2.jpg"/></a></div>
 <div class="thumbnails"><a href="images/gallery/recent/1.jpg"><img src="images/navigation/recent/1.jpg"/></a></div>
</div>

脚本的一部分：

$(document).on("click", "#menu", function(event) {
event.preventDefault();
var link = this.hash;
var ref = this.hash.replace("#", "") + ".html " + link;
var deferred2 = $.Deferred();
goLoad();
function goLoad(){
  switch(link){
    case "#recent":
     $("#recent").css("height", window.innerHeight);
     $("#recent").load(ref + " > *", null, goRecent());
    break;
  /*..other cases...*/
  }
};
function goRecent(){
  setTimeout(function(){
    deferred2.resolve();
    deferred2.done(doGallerySize, doGallery, goScroll)
    function doGallerySize(){
      $("#gallery").css("height", window.innerHeight);    
    }
    function doGallery(){
      Galleria.run("#galleria",{
        dataSource:"#source1, #source2",
        keepSource:true,
        responsive:true,
        thumbnails:false
      });
    }
    function goScroll(){
      $.smoothScroll({
          scrollTarget: link,
          afterScroll: function() {
            $(".stickynav").sticky({topSpacing:0});}
      });
    }
  }, 100);
}
});

Answer 1

.ready（）你在寻找什么？

http://api.jquery.com/ready/

Answer 2

我发现这对我有用，我的脚本代码更简短，我将它附加到body元素，并将特殊字符转义。

// this must happen as soon as your program starts, before
// you do anything else with the settings
if (Properties.Settings.Default.UpgradeRequired)
{
    // upgrade FIRST, before doing anything else with the settings
    Properties.Settings.Default.Upgrade();
    Properties.Settings.Default.UpgradeRequired = false;
    Properties.Settings.Default.Save();
}

代码将添加到正文的底部，因此您可以确保访问dom中的动态加载元素。

元素完全加载到页面后触发函数

2 个答案: