Events not work

I don’t know why none of the events have taken effect,
this is my html , please help me take a look?

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <script type="text/javascript" src="http://onlyofficeserver/onlyoffice/web-apps/apps/api/documents/api.js"></script>
    <script type="text/javascript" language="javascript" >
        var  config = {
            "document": {
                "permissions": {
                    "edit": true
                },
                "fileType": "docx", // 展示文件的类型
                "key": "docx-3979-11111111117770.docx",
                "title": "页面展示的文件名称",
                "url":"xxxxxxxxxxxxxxx" //读取文件进行展示
            },
            "documentType": "text",//presentation\spreadsheet\ text\
            "editorConfig": {
                "customization": {
                    "about": false,
                    "feedback": false,
                    "chat": true,
                    "commentAuthorOnly": false,
                    "compactToolbar": false,
                    "autosave": true,
                    "forcesave": true,
                    "spellcheck": false
                },
                "lang" : "zh-CN",
                "autosave": true,
                "mode":"edit",//edit
                // 回调接口,用于编辑后实现保存的功能,(关闭页面5秒左右会触发)
                "callbackUrl": "http://server/onlineedit/office/saveFile/docId/18774/mailMd5/7926e2f1080048fd08e5ae3d170595fdc01c1508",
            },
            "events":{
                "onDocumentStateChange":onDocumentStateChange,
                "onDocumentReady":onDocumentReady
            },
            "type": "desktop",//desktop、mobile、embedded
            "height": "1000px",
            "width": "100%"
        }
        var onDocumentReady = function ()  {
            console.log("onDocumentReady");
        };
        var onDocumentStateChange = function (event)  {
            if (event.data) {
                alert("文档已更改");
            } else {
                alert("在文档编辑服务上收集更改");
            }
        };

        let docEditor ;
        var connectEditor = function ()  {
            console.log("connectEditor");
            docEditor = DocsAPI.DocEditor("placeholder", config);
            onsole.log("connectEditor2");

        };

        if (window.addEventListener) {
            window.addEventListener("load", connectEditor);
        } else if (window.attachEvent) {
            window.attachEvent("load", connectEditor);
        }

    </script>
    <title>在线编辑文档</title>
</head>

<body style="height:100%; margin:0;">

<div  id = "placeholder"> </div >

</body>

</html>

Hello @yuhui

Iteratively events are better to place before rendering editor, considering that you are initializing editor via function, simply moving events before config object should do the trick:

        var onDocumentReady = function ()  {
            ...
        };
        var onDocumentStateChange = function (event)  {
            ...
        };
        var  config = {
            ...
        };

Result:

Second event onDocumentStateChange also prompts a pop-up when any changes are made.

1 Like

Thank you, this solved my problem

1 Like

Glad it worked.