iFrame url更改時執行函數

我的網站上有一個iframe的註冊表單，我想在iframe的url更改時（用戶成功註冊時）創建重定向。iFrame url更改時執行函數

這兩個網站是跨域，我知道這是幾乎不可能的拉網址跨域，但有沒有解決方法？我知道src不會改變，我想用onload()，當iframe加載第二次（當用戶成功註冊時），執行一個函數重定向到一個感謝頁面。

2012-09-11 seant

以下是使用javascript'Porthole'的示例。

它的可能性，但請記住iframe的安全問題。解決方案：如果您擁有原始頁面+ iframe的控制權，您可以通過在兩邊實施一些JavaScript來「欺騙」瀏覽器。

首先在兩個域上創建一個「代理」頁面。將它命名爲「proxy.html」什麼的（注：必須使用「porthole.min.js」，你可以從底部的來源得到這個）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <!-- Replace the url with your own location --> 
     <script type="text/javascript" src="porthole.min.js"></script> 
     <script type="text/javascript"> 
      window.onload=function(){ Porthole.WindowProxyDispatcher.start(); }; 
     </script> 
    </head> 
    <body> 
    </body> 
</html>

在父頁面：（參考IFRAME proxy.html頁）

<script type="text/javascript" src="porthole.min.js"></script> 
<iframe id="guestFrame" name="guestFrame" src="http://iframe.otherdomain.com/"></iframe> 

<script type="text/javascript"> 
var iframeDomain = 'http://iframe.otherdomain.com'; 
var redirectUrl = 'http://www.mydomain.com/redirect-to/signed-up'; 

function onMessage(messageEvent) { 
    if (messageEvent.origin == iframeDomain) { 
     if (messageEvent.data["action"] 
     && messageEvent.data["action"] == 'signed-up) { 
      window.location.href = redirectUrl; // The final action! 
      // This is the eventual redirect that will happen 
      // once your visitor has signed-up within the iframe 
     } 
    } 
} 
var windowProxy; 
window.onload=function(){ 
    // Create a proxy window to send to and receive messages from the iFrame 
    windowProxy = new Porthole.WindowProxy(
     'http://iframe.otherdomain.com/proxy.html', 'guestFrame'); 

    // Register an event handler to receive messages; 
    windowProxy.addEventListener(onMessage); 
}; 
</script>

在的iframe頁面（指父 proxy.html頁）

<script type="text/javascript"> 
var windowProxy; 
window.onload=function(){ 
    // Create a proxy window to send to and receive messages from the parent 
    windowProxy = new Porthole.WindowProxy(
     'http://www.mydomain.com/proxy.html'); 

    // Register an event handler to receive messages; 
    windowProxy.addEventListener(function(event) { 
     // handle event (not used here, the iframe does not need to listen) 
    }); 
}; 
</script>

從iframe中，您可以發送帶有javascript的消息到父頁面（以及其他方式）。如果您在iframe域中僅使用1個JavaScript，則可以執行此類操作，以便在URL更改爲特定內容時向父框架發送消息，例如'signed-up.php'（未經測試，但您會的想法）

<script type="text/javascript"> 
window.onload=function(){ 
    if(window.location.href.indexOf("signed-up.php") > -1) { 
     windowProxy.post({'action': 'signed-up'}); // Send message to the parent frame 
     // On the parent page, the function 'onMessage' is triggered. 
    } 
}; 
</script>

來源：

http://ternarylabs.github.io/porthole/
Github上：https://github.com/ternarylabs/porthole
演示：http://sandbox.ternarylabs.com/porthole/

來源

2014-06-20 22:33:48 Develop123

iFrame url更改時執行函數

回答

相關問題