在具有剛加載了jQuery的內容的div中實現jQuery .load（）

我有一個使用jQuery刷新.load（）的div。一旦它被刷新，新的內容出現在div中。然而，新內容中包含jQuery，並且它不起作用，即使該內容加載到自己的頁面上時它仍然有效。在具有剛加載了jQuery的內容的div中實現jQuery .load（）

該div也在父窗口中，但是刷新div的jQuery代碼位於iframe中。代碼調用top.document（父窗口）來刷新iframe外部的div。

我將展示完整的代碼在這裏：

這就是所謂test.php的主頁。它只是一個簡單的iframe，在它下面是代碼告訴它在iframe中刷新的div。

<html> 
<head> 
</head> 
<body > 
<iframe src="test2.php" width="400" height="400" frameborder="3"></iframe> 
<div id="target">This text will be replaced.</div> 
</body> 
</html>

這裏是test2.php這是iframe內，所以你可以方便地按一個鏈接，激活下一個頁面，其接通jQuery代碼加載頁面時，它只是開始的iframe頁面。

<html> 
<head> 
</head> 
<body> 
<a href="test3.php">Click Me, if the div below reloads with the jqery content it worked!</a> 
</body> 
</html>

這裏是頁test3.php與刷新的iframe外的DIV jQuery代碼。 .load（）起作用，但.get（）不起作用。我試圖用.get（）和.getscript（）調用jQuery，但那確實奏效。我也嘗試將它們封裝在.bind（）.on（）.live（）中，但是如果您知道以某種方式使用這些方法的方式，那麼您可以自由地將它們發佈。

<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
<script type="text/javascript"> 

$('#target', top.document).load("test4.php"); 
$('#target', top.document).get('testb.js'); 

</script> 
</head> 
<body> 
Sent 
</body> 
</html>

這是test4.php，它是在刷新後加載到div中的新內容。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
<p>....Polo</p> 
<script type="text/javascript" src="testb.js"></script>

現在這裏是jQuery的我試過DIV中實現，這裏面是什麼頁面test3.php和test4.php testb.js。我打算做更復雜的代碼，但由於沒有jQuery工作，我決定簡化它，直到jQuery不工作的原因可以被發現。

var myvariable = "Marco"; 
$("p").prepend(myvariable);

非常感謝您給予的幫助！

來源

2011-12-16 Christie

我實際上建議你不要這樣做。當然，你不應該有碎片，然後加載更多的碎片。這種方式導致瘋狂。

我已經能夠得到它的功能，但如果我有它重寫，我會做不同的。它看起來很脆弱，而且很難測試。我相信，如果主機文檔具有所有邏輯，並且這些碎片不會帶來任何邏輯，它就會更好。

我在加載（）時遇到了問題，但我無法記起確切的細節。可能來自瀏覽器之間的差異？我們最終使用get（）而不是load（）。

由於新的Javascript沒有附加到文檔中，所以最大的問題是$（'＃target'）失敗。因此，在load（）調用期間觸發時，它不會在主機文檔中找到ID。我能解決這個用的setTimeout（）

<body> 
    <div id="stuff> 
     <script type="text/javascript"> 
      setTimeout(function() { 
       $('#target', top.document).get('testb.js'); 
      }, 1); 
     </script> 
     Sent 
    </div> 
</body>

棘手位實際上可能是在路上我抓起DIV：

$.get("/foo/bar", function(html) { 
    var div = $('<div></div>'); 
    div.html(html); 
    div.find('#stuff').detach().appendTo(target); 
});

來源

2011-12-20 22:56:42 Jason

我剛纔試圖與谷歌瀏覽器，但它沒不爲我工作。謝謝你試圖幫助，但！ – Christie 2011-12-20 23:47:58

在具有剛加載了jQuery的內容的div中實現jQuery .load（）

回答

相關問題