Question

我可以通过点击菜单成功打开一个剑道窗口。

我的要求就是，如果我点击这个窗口上的一个按钮，它应该动态创建一个iframe并附加到div并将这个新div附加到父容器并显示为一个新窗口就像我打开它一样菜单。

我可以成功地将iframe和div添加到父级，但是当我打开窗口时，它在我所在的窗口内打开而不是从父容器中打开。我的代码如下：

  $("#btn").click(function () {

        var k = "<div id='kk'><iframe style='height:600px;width:900px'></div>";
        $("#menuDiv", parent.document).append(k);

        $("#kk", parent.document).kendoWindow();
    });

Answer 1

知道窗口是浮动的，尽管包含它的HTML元素，从另一个窗口打开它甚至动态生成打开窗口的内容都非常简单。

给出以下包含原始窗口的HTML代码：

<div id="container">
    <div id="win1">
        <h1>Window 1</h1>
        <button id="open" class="k-button">Open</button>
    </div>
</div>

我们将按钮的click处理程序定义为：

$("#open").on("click", function() {
    var w2 = $("<div>Window2</div>");
    $("#container").append(w2);
    w2.kendoWindow({});
});

我们将动态生成的第二个窗口（w2）附加到第一个窗口的container，然后将其初始化为kendoWindow。

我们可能已将第二个窗口添加到第一个窗口：

$("#open").on("click", function() {
    var w2 = $("<div>Window2</div>");
    w1.element.append(w2);
    w2.kendoWindow({});
});

其中w1是var w1 = $("#menuDiv").data("kendoWindow");，但这并没有任何区别，因为窗口是浮动元素，不受其父HTML节点的约束。

您可以在此处看到它：http://jsfiddle.net/OnaBai/juunjch1/

如果您希望打开的窗口内容为iframe，则应实际创建window，并将iframe选项设置为true。类似的东西：

$("#open").on("click", function() {
    var w2 = $("<div>Window2</div>");
    $("#container").append(w2);
    w2.kendoWindow({
        content: "http://www.telerik.com",
        iframe: true
    });
});

你可以在这里看到它：http://jsfiddle.net/OnaBai/juunjch1/2/

如何从另一个窗口打开一个Kendo ui窗口？

1 个答案: