如何使用AJAX作爲iframe的替代方案？

此刻，我在我的網站上使用iframe來顯示來自其他頁面的內容，例如表單。我遇到的問題是在登錄頁面上，當用戶使用iframe內的表單登錄時，它僅顯示登錄iframe中的下一頁 - 這完全沒用。如何使用AJAX作爲iframe的替代方案？

我聽說AJAX對於像這樣的事情來說更加靈活和動態，但我無法弄清楚如何使用它，我已經看過一些教程，但似乎沒有得到那麼遠的顯示頁面內的頁面。

如何用AJAX替換我的iframe？

預先感謝:)

2012-04-29 Lissy

既然你不會使用iFrame中，您將需要一個容器來把你的頁面進入。使用AJAX，通常使用<div>元素來保存該數據。另外，支持AJAX的jQuery或其他Javascript庫將使您的工作更輕鬆，並且可以使用經過測試的代碼，因此您可以專注於業務邏輯而不是基本內容。所以，在你的HTML，您將需要一個容器元素：

<div id="otherpage"></div>

然後在包括JavaScript文件，你可以使用這個jQuery的：

$(document).ready(function() { 
    $('#otherpage').load('otherpage.html', function() { 
     alert('Load was performed.'); 
    }); 
});

當然，使用前，請確保您也包括jQuery。 This tutorial應該可以幫助您開始使用jQuery。

來源

2012-04-29 12:13:03

感謝，這正是我試圖做的，並解釋清楚真的謝謝你:) X – Lissy 2012-04-29 13:31:26

我只是發現這一點，並認爲這只是代表的事情花邊一些iframes。我將代碼複製到我的頁面和Bang！它第一次工作完美。然後我試圖點擊我的'otherpage'中的一個按鈕，它不起作用。該按鈕還可以運行一些jQuery。我想要做不可能的事情嗎？或者這只是我錯過的一個微不足道的小問題？ – TrapezeArtist 2013-11-17 18:12:58

剛剛看到這個評論4年後，因爲有人upvoted。爲了回答未來的讀者，當您動態加載HTML內容時，您需要確保您的jquery綁定位於文檔中，而不是元素上。例如：'$（document）.on（'click'，'.my-button'，myHandler）;'而不是'$（'。my-button'）。on（'click'，myHandler）;' – 2017-05-24 13:03:30

您面臨的問題與其他任何事情相比，更多地涉及到ajax。

嘗試在主機html（不是通過ajax加載的）中「預加載」你的js函數，並通過ajax加載特定的呈現html。

然後，使用jquery「.done（函數（數據）{...」）方法來調用js函數「預先加載」< <（包含在基本html /文檔中）。。

希望這有助於，問候

嘗試是這樣的：。

 

    $(document).ready(function(){ 
     $.ajax(
      url : './your_script.php', 
      context: 'document', 
     ).done(function(data){ 
      $('#your_div').html(data); 
      your_js_function(); 
     }) 
    }); 

    // ---- main html 
    function your_js_function(){ 
     alert('got it!'); 
    };

來源

2014-05-18 21:51:54 jjyepez

如何使用AJAX作爲iframe的替代方案？

回答

相關問題