SimpleModal：如何在模态中提交后传递 mailtolink window

Question

我正在使用简单模式在用户可以向特定地址发送电子邮件之前显示法律警报：

在我的主页上：

<a href="mailto:somebody@abc.com" class="legalnotice">somebody@abc.com</a>

jQuery 正在使用：

jQuery(function ($) {
    $('.legalnotice').click(function(e) {
        var src = "email_alert.html";
        $.modal('<iframe src="' + src + '" height="400" width="390" style="border:0" id="legalFRAME">', {
            closeHTML:"",
            closeCLASS:"simplemodal-close",
            containerCss:{
            backgroundColor:"#f8f8f8",
            borderColor:"#f8f8f8",
            height:500,
            padding:0,
            width:400
        },
        overlayClose: true
        });

        return false;
    });
});

email_alert.html 包含：

<form name="alertFORM" id="alertFORM" action="">
  <div class="row-box"><input type="checkbox" /><label>I understand and agrees</label></div>
  <input name="Submit" type="submit" class="modal-close simplemodal-close" id="Submit" value="Close" />
</form>

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
$('#alertFORM').submit(function() {
    window.parent.jQuery.modal.close(true);
});
</script>

当用户单击电子邮件地址时，window 按预期打开。他们检查 "I understand" 以接受通知，点击 "Submit"，然后 window 关闭 - 正如预期的那样。但是，我不知道如何让打开的页面继续并从它停止的地方继续，所以他们的电子邮件客户端现在打开了，这样他们就可以写一封电子邮件到选定的地址。

请多多帮助??

Answer 1

您可以通过以下方式触发 mailto window 打开：

window.location.href = "mailto:email@example.com";

因此您可以在模式关闭后添加：

$('#alertFORM').submit(function() {
    $.modal.close();
    window.location.href = $('.legalnotice').attr('href');
});

如果您想要一种在打开对话框时传递 href mailto 值的动态方法，请使用：

$('.legalnotice').on('click', function (e) {
    e.preventDefault();
    var mailto = $(this).attr('href');

    $.modal($('#alertFORM'), {
        closeHTML: "",
        closeCLASS: "simplemodal-close",
        containerId: "modal",
        containerCss: {
            backgroundColor: "#f8f8f8",
            borderColor: "#f8f8f8",
            height: 500,
            padding: 0,
            width: 400
        },
        overlayClose: true,
        onClose: function (dialog) {
            $.modal.close();
            window.location.href = mailto;
        }
    });
});

在 onClose 回调中，触发 mailto window 在对话框关闭时以 window.location.href = mailto 打开：

onClose: function (dialog) {
    $.modal.close();
    window.location.href = mailto;
}

.. 以及你的 iframe:

$('.legalnotice').on('click', function (e) {
    e.preventDefault();
    var src = "email_alert.html";
    var mailto = $(this).attr('href');

    $.modal('<iframe src="' + src + '" height="400" width="390" style="border:0" id="legalFRAME">', {
        closeHTML: "",
        closeCLASS: "simplemodal-close",
        containerId: "modal",
        containerCss: {
            backgroundColor: "#f8f8f8",
            borderColor: "#f8f8f8",
            height: 500,
            padding: 0,
            width: 400
        },
        overlayClose: true,
        onClose: function (dialog) {
            $.modal.close();
            window.location.href = mailto;
        }
    });
  });
});

Answer 2

将带有外部文件的 iframe 放回原处的小改动，效果很好。

$('.legalnotice').on('click', function (e) {
    e.preventDefault();
    var src = "email_alert.html";
    var mailto = $(this).attr('href');

    $.modal('<iframe src="' + src + '" height="400" width="390" style="border:0" id="legalFRAME">', {
        closeHTML: "",
        closeCLASS: "simplemodal-close",
        containerId: "modal",
        containerCss: {
            backgroundColor: "#f8f8f8",
            borderColor: "#f8f8f8",
            height: 500,
            padding: 0,
            width: 400
        },
        overlayClose: true,
        onClose: function (dialog) {
            $.modal.close();
            window.location.href = mailto;
        }
    });
 });
});

感谢协助！！

SimpleModal：如何在模态中提交后传递 mailtolink window

SimpleModal: how to pass mailtolink after Submit in the modal window

javascript

jquery

simplemodal