使用Jquery延遲加載特定元素

我是一個JS/JQ noob嘗試延遲某些元素的加載，直到頁面的其餘部分加載完畢。使用Jquery延遲加載特定元素

具體來說，每個頁面有幾個列表，其中包含社交媒體iframes /遠程腳本作爲列表項目，並且其url是使用php生成的。

我最好的猜測會是這樣的（內置）：

$(document).ready(function(){ 
    $('ul.post-meta-bottom').append('        
           <li class="like-button"> 
            <iframe class="fblikebutton" src="http://www.facebook.com/plugins/like.php?href=<?php echo urlencode($this_permalink); ?>&amp;layout=button_count&amp;show-faces=false&amp;width=80&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="overflow:hidden; width:80px; height:30px"></iframe> 
           </li><!--like-button--> 

           <li class="tweet-button"> 
            <a href="http://twitter.com/share" class="twitter-share-button" data-url="<?php echo $this_permalink; ?>" data-text="<?php echo $this_title; ?>" data-count="horizontal" data-via="" data-related="">Tweet</a> 
            <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script> 
           </li><!--tweet-button--> 

           <li class="reddit-button"> 
            <script type="text/javascript"> 
             reddit_url = "<?php echo urlencode($this_permalink); ?>"; 
             reddit_title = "<?php echo $this_title; ?>"; 
             reddit_target= "gaming"; 
            </script> 

            <script type="text/javascript" src="http://www.reddit.com/static/button/button1.js"></script> 
           </li><!--reddit-button--> 
          ') 
});

...這不工作，我肯定是不這樣做，無論如何最好的辦法。

有人幫忙嗎？謝謝！

來源

2011-07-28 Jartron

不，這不會工作，因爲js是客戶端。所有這些php元素都在服務器端進行評估。只需將這些元素放在.php文件中，並在客戶端查看頁面時加載它們。爲了延緩php的負載，你應該問php的傢伙。 –

你能發佈整個頁面源嗎？ –

@Joseph 我打算把這個內聯，所以PHP會在JS之前完成這件事情。 – Jartron

你可以使用load（）方法（因爲你說這是行內，我想，你要發送的JavaScript之前，呼應從PHP價值 - 一切都做服務器端）：

$(document).ready(function(){ 
    $('.post-meta-bottom').load(function(){ 
          $(this).append('<ul> 
            <li><?php echo facebook_iframe_stuff; ?></li> 
            <li><?php echo reddit_javascript_stuff; ?></li> 
            <li><?php echo dynamic_twitter_link; ?></li> 
            <li><?php echo etc_etc; ?></li> 
            </ul>'); 
    }); 
});

來自文檔：

加載事件發送到一個元素，當它和所有的子元素已完全加載。此事件可以發送到與URL相關聯的任何元素：圖像，腳本，框架，iframe和窗口對象。

來源

2011-07-28 16:06:10

感謝尼古拉這看起來像我在找什麼，但它不工作！ – Jartron

我已經更新了我的問題中的代碼，以便實際使用。 – Jartron

我不是jQuery專家，但爲什麼不使用.delay(time)？

來源

2011-08-23 15:19:09

使用Jquery延遲加載特定元素

回答

相關問題