Javascript iFrame验证

目前，我的主页中有一个iframe，其中有许多复选框，需要在离开iframe之前进行操作。i、 例如，如果用户开始选中复选框，中途单击主页上的上一步，即离开iframe，我希望能够捕获/验证他们是否离开了iframe，并用一条消息提示他们，比如说“注意：您将丢失此处输入的所有数据-离开：是/否？”键入消息。

。这篇4guys文章听起来像是你需要的。它讨论onbeforeunload事件。在stackoverflow上也有一些关于onbeforeunload的精彩内容

---

似乎onbeforeunload确实不会为iframe触发。混蛋

下面是一些应该可以工作的示例代码。这仅在您位于同一个域中时有效，否则将阻止iframe与父级对话

我还没有在很多浏览器中测试过这些

这里有两个选项，这取决于您希望将更改提示放在何处

选项一涉及iframe在发生更改时通知父窗口

父窗口javascript:

    window.onbeforeunload=closeIt;
    var changes = false;
    function closeIt()
    {
      if (changes)
      {
          return "Yo, changes, save 'em?";
      }
    }
    function somethingChanged() {
        changes=true;
    };

Iframe javascript：

    $(function() {
        $('input').change(parent.somethingChanged);
    });

    $(function() {
        parent.window.onbeforeunload = myCloseIt;
        $('input').change(somethingChanged);
    });
    var changes = false;
    function myCloseIt()
    {
      if (changes)
      {
          return "Yo, changes, save 'em?";
      }
    }
    function somethingChanged() {
        changes=true;
    };

选项二涉及iframe控制父窗口的onbeforeunload

父窗口javascript:

    $(function() {
        $('input').change(parent.somethingChanged);
    });

    $(function() {
        parent.window.onbeforeunload = myCloseIt;
        $('input').change(somethingChanged);
    });
    var changes = false;
    function myCloseIt()
    {
      if (changes)
      {
          return "Yo, changes, save 'em?";
      }
    }
    function somethingChanged() {
        changes=true;
    };

没有：-）

Iframe javascript：

    $(function() {
        $('input').change(parent.somethingChanged);
    });

    $(function() {
        parent.window.onbeforeunload = myCloseIt;
        $('input').change(somethingChanged);
    });
    var changes = false;
    function myCloseIt()
    {
      if (changes)
      {
          return "Yo, changes, save 'em?";
      }
    }
    function somethingChanged() {
        changes=true;
    };

在这两种选择中，朴素的

更改

变量可以稍微增强一点，可能使用4guys文章中的技术，以查看是否真的有任何更改

---

如果它们在不同的域上，但您仍然负责HTML的“两面”，那么仍然有一些选项，它们只是更难

---

是一个使用

postMessage

和位置哈希以及秘密巫术进行跨站点通信的库。

它可能需要一些mod（比如进入iframe获取复选框），但这个概念仍然适用。如果你有问题，我会大声叫喊，看看我是否可以制作一个sampleHi Dan，不幸的是，我似乎无法在iframe级别激发它，只能在父级激发它。如果您能用一些示例代码为我指出正确的方向，以便在iframe级别捕获，我将不胜感激-谢谢。不用担心，我会在早上尝试一些想法并更新答案。现在是凌晨1点半在澳大利亚，我要睡觉了：-）谢谢你，丹，非常感谢。如果可以的话，我会有一个剧本，如果有任何疑问，我会给你回复的？是的，别担心，如果你有剧本的话，就直接问吧