0

我有一个名为 parent.html 的 html 页面，它有 Bootstrap 手风琴。通过单击手风琴上的链接，它会调用另一个页面 search.html 并在模式上打开 iframe。

search.html 有一个“完成”按钮，其功能是关闭模式，在手风琴上发布数据，手风琴应该保持打开状态。

我试过 .opener()。它似乎没有用。任何指针？

父.html

选购花店 找花店 
$(function () {
    $("*[data-modal]").click(function (e) {
        e.preventDefault();
        var href = $(this).attr('href');
        if (href.indexOf('#') != 0) {
            $('<div id="searchBox" class="modal bigModal" data-backdrop="static"><div class="searchModal-header gutter10-lr"><button type="button" onclick="window.location.reload()" class="close" data-dismiss="modal" aria-hidden="true">×</button></div><div class=""><iframe id="search" src="' + href + '" class="searchModal-body"></iframe></div></div>').modal();
        }
    });
});

搜索.html

<!DOCTYPE html>
<html lang="en">
<head>
<head>
    <meta charset="utf-8">
    <title>Getting Started</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="../css/bootstrap.css">
</head>
<body id="detail">
<form class="form-horizontal" id="frmdetail" name="frmdetail" action="preferences"  method="POST">
<div class="row-fluid gutter10-tb border-t">
   <a class="btn btn-primary my-list" href="#">Finish</a>
</div>
</form>
</div>
<script type="text/javascript">
    $(document).ready(function(){

        if (top === window) {
            alert("this page is not in an iframe");
        } else {
            alert ("Im here");
            $('.my-list').click(function(){
                alert("Im clicked");
            $('.modal', opener.document).dialog('close');
        });
        }
    });
</script> 
</body>
</html>
4

1 回答 1

0

您可以尝试使用 postMessage： http ://en.wikipedia.org/wiki/Cross-document_messaging https://developer.mozilla.org/en-US/docs/DOM/window.postMessage

您应该从 search.html 向主页发送命令，让主页处理收到消息的事件。

你会在上面的链接中找到你需要的东西

示例（父页面）：

window.onmessage = function(e){
    //Here is the data that you receive from search.html
    var DataReceived = e.data;
    var OriginUrl = e.origin;

    //Do what you want when the message is received
};

示例（search.html）：

function buttonClick() {
    var curDomain = location.protocol + '//' + location.host; //This will be received as e.origin (see above)
    var commandString = "Hello parent page!"; //This will be received as e.data
    parent.postMessage(commandString,curDomain); //Sends message to parent frame
}

父页面中的 windows.onmessage 应该在页面加载时“启动”。'buttonClick()' 函数可以在您想向父页面发送消息的时间和地点被调用，该页面将执行一些东西（在这种情况下，你的东西带有手风琴）

编辑：关闭模式尝试这种方式：

家长：

window.onmessage = function(e){
    //Here is the data that you receive from search.html
    var DataReceived = e.data;
    var OriginUrl = e.origin;
    if (e.data == 'close') {
        $(this).modal('hide'); //Example code, you can run what you want
    }
};

搜索：

function buttonClick() {
    var curDomain = location.protocol + '//' + location.host; //This will be received as e.origin (see above)
    var commandString = "close"; //This will be received as e.data
    parent.postMessage(commandString,curDomain); //Sends message to parent frame
}

在这种情况下，您将消息“关闭”发送到父框架。当父母收到消息时，他检查它是否“关闭”，然后运行您想要的代码（在这种情况下，您使用 $(".modal").dialog('close') 关闭您的模式）

于 2013-04-17T18:42:21.030 回答