Question

我从服务中获取了一些json数据，并将这些值以子窗口中的表格式绑定。单击子窗口中的链接，应关闭子窗口并在当前父窗口中重定向URL。

    <html>

    <head>
        <title>sample</title>
        <script type="text/javascript">
        var childWindow;
            function GenerateStudentsTable() {
                var jsondata = {
                    "school": {
                        "students": [{
                                "studentId": "Test1",
                                "Name": "Message01"
                            },
                            {
                                "studentId": "Test2",
                                "Name": "Message2"
                            }, {
                                "studentId": "Test3",
                                "Name": "Message3"
                            }
                        ],
                        "redirectURL" : "https://www.google.com/search"
                    }
                }

                var query = "students";
                var table = document.createElement("TABLE");
                table.border = "1";

                var headerLabels = ["Id", "Name"]
                var headerLabelsCount = headerLabels.length;

                var row = table.insertRow(-1);
                for (var i = 0; i < headerLabelsCount; i++) {
                    var headerCell = document.createElement("TH");
                    headerCell.innerHTML = headerLabels[i];
                    row.appendChild(headerCell);
                }

                var jsonLength = Object.keys(jsondata.school.students).length;
                for (var i = 0; i < jsonLength; i++) {
                    row = table.insertRow(-1);
                    for (var j = 0; j < headerLabelsCount; j++) {
                        var cell = row.insertCell(-1);
                        if (j == 0) {
                            cell.innerHTML = '<a href="javascript:window.opener.redirectToParentWindow()">' + jsondata.school.students[i].studentId + '</a>';
                        } else {
                            cell.innerHTML = '<a href="javascript:window.opener.redirectToParentWindow()">' + jsondata.school.students[i].Name + '</a>';
                        }
                    }
                }

                childWindow = window.open("", "Title", "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=780,height=200,top=" + (screen.height - 400) + ",left=" + (screen.width - 840));
                childWindow.document.body.innerHTML = table.outerHTML;
            }

            function redirectToParentWindow()
            {
                childWindow.close();
                window.location.href =jsondata.school.redirectURL;
            }
        </script>
    </head>

    <body>
    <input type="button" value="Generate Table" onclick="GenerateStudentsTable()" />
        <hr />
        <div id="dvTable">
        </div>
    </body>

</html>

在子窗口中的绑定数据中我没有任何问题，但是我不确定如何关闭子窗口并重定向到父窗口中的链接。预先感谢

Answer 1

以下代码更改按预期进行。

<html>

<head>
    <title>sample</title>
    <script type="text/javascript">
        var childWindow, redirectUrl;
        function GenerateStudentsTable() {
            var jsondata = {
                "school": {
                    "students": [{
                        "studentId": "Test1",
                        "Name": "Message01"
                    },
                    {
                        "studentId": "Test2",
                        "Name": "Message2"
                    }, {
                        "studentId": "Test3",
                        "Name": "Message3"
                    }
                    ],
                    "redirectURL": "https://www.google.com/search"
                }
            }

            var query = "students";
            var table = document.createElement("TABLE");
            table.border = "1";

            var headerLabels = ["Id", "Name"]
            var headerLabelsCount = headerLabels.length;

            var row = table.insertRow(-1);
            for (var i = 0; i < headerLabelsCount; i++) {
                var headerCell = document.createElement("TH");
                headerCell.innerHTML = headerLabels[i];
                row.appendChild(headerCell);
            }

            var jsonLength = Object.keys(jsondata.school.students).length;
            for (var i = 0; i < jsonLength; i++) {
                row = table.insertRow(-1);
                for (var j = 0; j < headerLabelsCount; j++) {
                    var cell = row.insertCell(-1);
                    if (j == 0) {
                        cell.innerHTML = '<a href="javascript:window.opener.redirectToParentWindow()">' + jsondata.school.students[i].studentId + '</a>';
                    } else {
                        cell.innerHTML = '<a href="javascript:window.opener.redirectToParentWindow()">' + jsondata.school.students[i].Name + '</a>';
                    }
                }
            }
            redirectUrl = jsondata.school.redirectURL.concat("?q=query");
            childWindow = window.open("", "Title", "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=780,height=200,top=" + (screen.height - 400) + ",left=" + (screen.width - 840));
            childWindow.document.body.innerHTML = table.outerHTML;

        }

        function redirectToParentWindow() {
            childWindow.close();
            window.location.href = redirectUrl;
        }

    </script>
</head>

<body>
    <input type="button" value="Generate Table" onclick="GenerateStudentsTable()" />
    <hr />
    <div id="dvTable">
    </div>
</body>
</html>

如何关闭子窗口并重定向当前父窗口中的链接

1 个答案: