Question

我有一个页面（A.html），它将打开一个内部有iframe（B.html）的kendo窗口。这是我在A.html中打开kendo窗口的配置：

var contentUrl = 'B.html';
var window = $("<div id='dvB' />").kendoWindow({
    title: "B", content: contentUrl, animation: false,
    resizable: false, modal: false, draggable: true, iframe: true, height: 550, width: 430,
            close: function () {
                this.destroy();
            }
        }).data('kendoWindow');
        window.open();

所以现在我想从A.html调用B.html中的retrieveFunction（）。我试着这样做：

Window = $('#dvB').data('kendoWindow');
Window.retrieveFunction();//not work

var windowElement = $("#dvB");
var iframeDomElement = windowElement.children("iframe")[0];
var iframeDocumentObject = iframeDomElement.contentDocument;
iframeDocumentObject.retrieveFunction(); //not work

任何人都知道如何实现这一目标？

Answer 1

您可以从B.html触发自定义事件并将函数作为参数传递并在A.cshtml上进行侦听，如下所示：

B.html

<script>
    function retrieveFunction() {
        console.log('retrieveFunction');
    }

    $(function () {
        window.parent.$('body').trigger('customEvent', { func: retrieveFunction});
    });
</script>

A.html

<script>
    $(function () {
        $('body').on('customEvent',
            function(event, data) {
                console.log('triggered');
                data.func();
            });

        $("<div id='dvB' />").kendoWindow({
            title: 'B', content: contentUrl, animation: false,
            resizable: false, modal: false, draggable: true, iframe: true, height: 550, width: 430,
            close: function () {
                this.destroy();
            }
        }).data('kendoWindow').open();
    });
</script>

如何触发kendo窗口内的功能？

1 个答案: