1

我是新手mootools，我正在处理演示示例，moopopup但对我来说，加载远程的选项 url 不会弹出。

<link href="moopopup.css" type="text/css" rel="stylesheet" />
    <script type="text/javascript" src="mootools-core-yc.js"></script>
<script type="text/javascript" src="mootools-more-yc.js"></script>
<script src="moopopup-yc.js" type="text/javascript"></script>

<script type="text/javascript">
    function runExample3() { 
        var mypopup3 = new moopopup({
            title: 'My home page',
            resizable: false,
            width: 800,
            max_body_height: 600,
            url: 'http://www.google.co.in/'
        });
        mypopup3.display();     
    }
</script>
</head>

<body onLoad="prettyPrint()">
<span class="button link" onclick="runExample3();">run javascript</span>
</body>

这是网址：

http://sasi.pro/searchsn/new/

4

1 回答 1

1

好吧，由于跨域安全性，您不能直接做您想做的事。您不能将其他网站导入到您自己的 html 中。您可以发出 ajax 请求，但不能通过 ajax 导入http://www.google.co.in/。

我不确定您将如何使用 moopopup，但我看到的唯一选择是使用htmlnodemoopopup 的选项并将其加载iFrame到其中。在这种情况下，它会起作用，你只剩下一些 CSS 工作。不过，有些网站不允许在 iFrame 中展示自己，谷歌就是其中之一。

在这里演示

我还对您的代码进行了一些小的更改，请注意，在您的网站/链接上，您正在调用一个prettyPrint()不存在的页面加载函数（可能是您拥有的其他代码的一部分）......

无论如何，我在演示中的代码：

HTML

<span class="button link">run javascript</span>
<div id="newiframe">
    <iframe src="http://www.yr.no" id="newiframe" />
</div>

CSS

#newiframe {
    display:none;
    width:770px;
    height:300px;
    overflow:auto;
}
.moopopup-body #newiframe {
    display:block;
}

脚本

var myIframe = document.id('newiframe');
function runExample3() {
    var mypopup3 = new moopopup({
        title: 'My home page',
        resizable: false,
        width: 800,
        max_body_height: 600,
        html_node: myIframe
    });
    mypopup3.display();
}

document.getElement('.button.link').addEvent('click', runExample3);
//commented because it doesn't exist
// window.addEvent('domready', function() { prettyPrint();});
于 2013-08-08T22:27:54.960 回答