如何在不使用iframe和标签的情况下显示弹出式联系表单

Question

这是我的html代码

    <!doctype html>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    <title>Modal Popup</title>

    <body>
    <a href="https://dev88.wufoo.com/forms/ze7xusq0j2tum9/" onclick="window.open(this.href,  null, 'height=823, width=680, toolbar=0, location=0, status=1, scrollbars=1, resizable=1'); return false">Please fill out my form.</a>

    </body>
    </html>

我可以知道，如何显示此联系我们表格，并在其外部单击并关闭。 我在此代码中的错误是什么。 你能帮助我吗？

Answer 1

为了满足“应在外部单击以关闭”的要求，您将需要一些JS来跟踪打开和关闭窗口的时间。 从父页面打开窗口时，它将打开一个弹出窗口，如果再次单击父页面，则窗口仍处于打开状态时，弹出窗口将关闭。

<script>
    var test = document.getElementById('test');
    var win = null;

    test.addEventListener('click', function(e) {
        e.preventDefault();
        e.stopPropagation();

        win = window.open(test.href,  null, 'height=823, width=680, toolbar=0, location=0, status=1, scrollbars=1, resizable=1');
        return false;
    });

    window.addEventListener('click', function(e) {
        if(win != null) {
            win.close();
            win = null;
        }
    });
</script>

...

<a href="https://dev88.wufoo.com/forms/ze7xusq0j2tum9/" id="test">Please fill out my form.</a>

工作演示： http : //jsfiddle.net/spryno724/b857X/2/

如何在不使用iframe和标签的情况下显示弹出式联系表单

问题描述

1 个解决方案

解决方案1
0 已采纳 2014-07-30 10:18:24

如何在不使用iframe和标签的情况下显示弹出式联系表单

问题描述

1 个解决方案

解决方案1 0 已采纳 2014-07-30 10:18:24

解决方案1
0 已采纳 2014-07-30 10:18:24