用jQuery加載HTML片段

我對jQuery，Ajax和類似的東西都很陌生。我已經找到了如何將HTML片段注入到我的網站的解決方案：用jQuery加載HTML片段

$(document).ready(function(){ 
    $('a').click(openContent); //binding all anchors to this function 
}); 

function openContent(){ 
var path = $(this).attr('href'); 
$('#content').load(path); 

return false; //to prevent browser from loading the single HTML fragment 
}

這工作真的很好！問題是，當點擊位於剛剛注入的新HTML片段中的錨點時，這些函數將不會被執行。所以這個片段不會被注入div，瀏覽器只會爲它自己加載片段。

希望有解決方案，是不是靠譜...感謝

UPDATE：
好了，生活做了很好的工作，但是，

有也是在這些片段中連接到jQuery lightbox插件（balupton-edition）和rel =「lightbox-tour」的圖片。它們顯示在新窗口而不是lightbox-div中。有什麼建議麼？

來源

2010-05-06 sam

您是否嘗試添加$（'＃content a'）。click（openContent）;在返回false之前; ？ – Adam 2010-05-06 18:02:16

是的，試過...沒有工作 – sam 2010-05-06 18:50:18

使用現場，將它綁定到被添加的每個錨：

$('a').live('click',openContent);

來源

2010-05-06 18:00:46 derek

該死......這很容易，而且效果很棒！謝啦！ – sam 2010-05-06 18:14:13

，但也有圖片連接到這些片段中的rel =「lightbox-tour」的jQuery lightbox插件（balupton-edition）。它們顯示在新窗口而不是lightbox-div中。 – sam 2010-05-06 18:49:29

很酷。 – 2012-03-08 03:14:06

另外，在jQuery的1.4+可以使用
$(document).delegate('a', 'click', openContent);

*現場和代表之間的主要區別，活將事件附加到文檔並處理事件，一旦它們起泡。使用委託，您可以指定將事件附加到的上下文。這裏的例子和使用live完全一樣。現在讓我們說，你只需要錨點出現在一個ID爲「contentArea」的div加載在這個莊園的內容。在這種情況下，你會寫$("#contentArea").delegate('a', 'click', openContent);。

更多關於生活和委託之間的差異退房Quick Tip: The Difference Between Live() and Delegate()

來源

2010-05-06 18:32:34 joshatjben

如果你解釋了'live'和'delegate'之間的區別，尤其是如果你包含了不同於'live'用法的上下文時，這將是一個更有用的答案（你的代碼應該與derek的答案中的功能相同）。 – eyelidlessness 2010-05-06 18:35:38

偉大的一點，更新我的回答 – joshatjben 2010-05-06 18:52:06

我試過委託，但片段不會顯示在div框中 – sam 2010-05-06 19:05:39

所以收藏不處理動態加載的鏈接？您可以更新代碼以重新運行加載回調中的lightbox插件。類似這樣的：

$(document).ready(function(){ 
    $('a').live('click', openContent); 
}); 

function openContent(){ 
    var path = $(this).attr('href'), 
     content = $('#content'); 

    // added callback here 
    content.load(path, function() { 
     content.lightbox(); 
    }); 

    return false; 
}

來源

2010-05-06 21:22:28 Andrew

用jQuery加載HTML片段

回答

相關問題