Question

当我通过window.open（）函数打开弹出窗口时，我想显示外部网站链接的加载图像图标。

我想到了一种方法，在'div'中显示加载图像并在Ajax调用中获取外部网站的内容，然后重新编写内容。由于这些是外部域，$ .get（“external-link”）将不起作用（尽管可能与某些变通方法无法链接）。

还有另一种方法可以解决这个问题吗？谢谢

Answer 1

是的，您可以将内容加载到iframe中，在点击链接时显示加载图片，并在加载iframe时隐藏它：

<a href="http://en.wikipedia.org/wiki/Main_Page" class="ilink">click me</a>
<br/>
<div id="dummyloader" style="display: none; width: 500px; height: 500px; background-color: gray"><h2>loading</h2></div>
<iframe src="" id="myframe" style="display: none;" width="500px" height="500px"></iframe>
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script>
    $(function(){
        $('.ilink').click(function(ev){
            ev.preventDefault();
            $('#dummyloader').show();
            $('#myframe').attr('src', $(this).attr('href'));

        })

        $('#myframe').load(function(){
            $('#dummyloader').hide();
            $(this).show();
        })
    })
</script>

live jsfiddle例子：http://jsfiddle.net/L01d5t5a/

在window.open中显示加载图像以获取外部链接

1 个答案: