用Ajax替換iframe

我的項目是在我的網站內預覽一些網站，我現在使用iframe加載網站預覽，然後用戶可以在iframe中進行交互。用Ajax替換iframe

我必須更改iframe的實現，以便在頁面內部對於SEO目的，那麼可以用什麼替代方法是Jquery .load（）函數。

$('div#websitePreview').load('Website_URL');

，但問題是當用戶與網站（點擊一些鏈接）整個頁面重定向到新的鏈接互動，所以有沒有辦法來加載它被點擊的用戶在頁面同一個div由ajax調用而不離開我的網站？

UPDATE： 我要預覽有我原來的網站的子域名的網站

來源

2013-06-24 Farok Ojil

你能顯示你的HTML代碼嗎？ –

嘗試

$('div#websitePreview a').live('click', function(event){ 
    event.preventDefault(); 
    var url = $(this).attr('href'); 
    $('div#websitePreview').load(url); 
}

來源

2013-06-24 08:41:16 jackchuka

'live'不再是jQuery的一部分，不應該被使用。應該使用委託事件處理程序代替'delegate'或'on'。 –

假設你是「預覽」的網站都在同一個域中的網站，您可以修改加載的div中的每個a標記，以使用以下代碼執行AJAX請求：

var $container = $('#websitePreview') 
$container.load('http://www.example.com'); // initial load 

// link click within loaded content. 
$container.on('click', 'a', function(e) { 
    e.preventDefault(); 
    $container.load($(this).attr('href')); 
});

另一方面，如果預覽的站點位於不同的域中，則由於「相同來源策略」，您無法從它們加載HTML。在這些情況下，iframe或CORS請求是您的唯一選擇，如果url是第三方，則後者極不可能發生。

來源

2013-06-24 08:43:01

在現代瀏覽器中，由於跨域安全限制，無法實現此目的。您不允許通過ajax訪問其他域名內容。

另一個問題是，如果您在網站的div中加載入口頁面，您可能會遇到css錯誤，因爲加載的css會覆蓋您網站的css。

來源

2013-06-24 08:43:34

我要預覽的網站有我的原始網站的子域，對不起，我應該提前 –

用Ajax替換iframe

回答

相關問題