如何在 iframe 中获取点击事件触发父框架中的警报

Posted 2023-05-09

【中文标题】如何在 iframe 中获取点击事件触发父框架中的警报

【英文标题】：How to get a click event in an iframe trigger an alert in parent frame

【发布时间】：2012-03-05 19:57:55

【问题描述】：

我的页面上有几个嵌入的iframes，我正在寻找iframe 内的点击事件以触发父框架上的警报。 （iframe 和父框架都是同一个域）。

iFrame html 元素（iframe 有一个类class="iframe1":

<a class="button" href="#">Trigger Parent Frame Alert</a>

iFrame jQuery：

$(document).ready(function()   
  $('.button').click(function() 
    window.parent.triggerAlert();
  );
);

父框架 jQuery：

$(document).ready(function() 
function triggerAlert()
    alert('iFrame button has been clicked');
  
);

我认为我的父框架函数不完整 - 并且不完全确定 iframe 可以与父 DOM 通信？

我之前尝试过这种替代方法，但在父框架中没有运气：

$('.iframe1').contents().find('.button').click(function () 
  alert("iFrame button has been clicked");
);

【参考方案1】：

为了使您的函数对 iframe 可见，您需要将其声明为窗口对象的成员：

$(document).ready(function() 
    window.triggerAlert = function ()
        alert('iFrame button has been clicked');
    
);

【参考方案2】：

您触发的警报功能处于关闭状态。 试试这个：

$(document).ready(function() 
 window.triggerAlert = function triggerAlert()
    alert('iFrame button has been clicked');
  ;
);