1

我有一个托管在域 A 上的信用卡支付表单的视图。域 B 有一个单独的网站，其中包含一个 iframe 到域 A 上的信用卡表单。

域 A 上的表单使用这样的 ajax 表单：

<% using (Ajax.BeginForm("CreditCard", "Framed", new { id = Model.SID },
   new AjaxOptions()
   {
       HttpMethod = "POST",
       InsertionMode = InsertionMode.Replace,
       UpdateTargetId = "credit-card-wrapper",
       LoadingElementId = "loading-pane"
   }, 
   new { id = "new-creditcard-form" }))
{ %>

然后在域 b 上，我使用自定义 jquery 插件通过允许外部事件更改 iframe 的 src 来管理我的 iframe。用法看起来像这样

$('#myIframe').frameplugin('creditcard');

这导致 iframe 将其 src 更改为信用卡页面。我还像这样将 onload 附加到 iframe：

$(this).bind('load', function () {
    var src = $(this).attr('src').toLowerCase();

    //do stuff based on url
});

我想要做的是当信用卡表单提交并完成替换时，我希望 iframe 中的文档触发 iframe 的 onload 事件，以便域 b 知道发生了什么事。

另一种解决方案是以某种方式将自定义事件绑定到 iframe 并在框架文档中触发它们。我不确定这如何/是否会起作用。有任何想法吗？

编辑：

我正在尝试使用从 iframe 到父级的事件触发器，但出现错误。

不安全的 JavaScript 尝试从 URL http://localhost:27412/Framed/Index/ 的框架访问具有 URL http : //localhost:59905/Home/Framed的框架。域、协议和端口必须匹配。

这是我的事件绑定

$(document).bind('success:myframe', function (event, referenceId) {
    //do something
});

这是来自框架页面的 javascript 调用。这是从 ajax.beginform 中的 OnSuccess 调用的

function paymentReceived() {
    var referenceNumber = $('#referenceNumber').text();
    $(top.document).trigger('success:myframe', referenceNumber);
}
4

1 回答 1

3

我认为您只想将事件从 iFrame 传递到父窗口。如果我错了，请纠正我。

从你的 iFrame，你不能这样做吗？

$(document).ready(function() {
    parent.alertPageWithIFrameThatLoadIsComplete();
});

编辑：让我再试一次。

这对我有用：

<script type="text/javascript">
    function oniframeLoad() {
     alert("Loaded!");
    }

    function changePage() {
     frames["my_iframe"].location.href = "http://google.com";
    }

    setTimeout(changePage, 2000);
</script>

<iframe onload="oniframeLoad()" name="my_iframe" id="my_iframe" src=""></iframe>
于 2011-01-19T19:57:29.200 回答