Sweet Alert 2在父框架中打开 [英] Sweet Alert 2 Open in Parent Frame

查看:150
本文介绍了Sweet Alert 2在父框架中打开的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个iframe,其源代码是php文件.我想做的是让Sweet Alert 2在父框架中打开,而不是在iframe中打开.我尝试更改目标,但没有成功.

I have an iframe with a source that is a php file. What I'm trying to do is get Sweet Alert 2 to open in the parent frame rather than inside of the iframe. I have tried changing the target and have not had any success.

以下目标选项均无效:

swal({
    target: 'window'
    target: 'document'
    target: 'parent'
});

这是我以身体"为目标时得到的结果:

This is the result that I get when 'body' is the target:

SweetAlert 2代码

SweetAlert 2 code

swal({
    type: 'error',
    text: 'You did not select any files.',
    target: 'top'
});

iFrame代码

<div id="viewWindow" class="col-xs-10 content">
    <iframe id="waiverList" src="php/edit_archive.php"></iframe>
</div>

推荐答案

您好,您可以做的是在您的父窗口中保存sweetalert2代码.然后,在iframe中使用JavaScript的parent属性来调用该函数.为避免出现相同的原始策略错误,您可以使用窗口发布消息.

Hi what you can do is have your sweetalert2 code in your parent window. Then use JavaScript's parent property inside your iframe to call the function. To avoid getting a same origin policy error you can use window post messages.

像这样:

父本

<!DOCTYPE html>
<html>
<body>
<script> 
    function openAlert() {
        swal(
            'Good job!',
            'You clicked the button!',
            'success'
        )
    }
    window.addEventListener("message", function(event) {
        if(event.data == "openAlert");{
            openAlert();
        }
    });

</script>
    <iframe src="iframe.html">

    </iframe>
</body>
</html>

iframe HTML

<!DOCTYPE html>
<html>
<body>
     <button onclick="foo();">Click Me</button>
     <script>
     function foo(){
         parent.postMessage("openAlert", "*");
     }
     </script>
</body>
</html>

这篇关于Sweet Alert 2在父框架中打开的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆