javascript - 如何将事件附加到 iframe 中的按钮

Question

现在我有一个 jQuery UI 对话框，其中包含 <iframe>对话框内部。当用户按下按钮时，会弹出对话框，并在 iframe 中显示表单编辑屏幕。

嗯，我想在内部表单编辑屏幕中有两个按钮，“取消”和“确定”。 “取消”不保存更改并关闭对话框，“确定”保存更改并关闭对话框。很简单..

那么如何将事件从父页面附加到 iframe 内的取消按钮呢？我还假设您需要以某种方式将一个事件附加到 iframe 的 DOM-ready，否则按钮将不存在。

你是如何做到这一点的？

此外，iframe 位于同一域中，因此无需担心跨域

这里有一个简单的例子 at jsbin与 iframe source

Answer 1

好的，这就是我为实现这一目标所做的事情。我将此代码添加到 iframe 页面:

$(document).ready(
  function()
  {
    $("#cancelbutton").click(
      function()
      {
        parent.CloseDialog();
      });
  });

然后在打开的页面中我添加了以下内容:

function CloseDialog()
{
  $('#diag').dialog('close');
}

因此，我没有尝试从框架中关闭对话框，而是在父页面中调用一个方法来负责关闭它。效果相同但更容易。似乎无法获得让我使用对话框方法的框架。但这有效。