ckfinder.net完全讲解四(ckfinder销毁和关闭)

本文主要讲解ckfinder关闭弹出窗口和ckfinder销毁过程

1.添加js

<script src="Js/jquery/jquery-1.4.4.min.js" type="text/javascript"></script>
    <script src="CkEditor/ckfinder/ckfinder.js" type="text/javascript"></script>
    <script type="text/javascript">
        var api;
        function BrowseServer(inputId) {
            var finder = new CKFinder({ width: 600 });
            finder.basePath = 'CkEditor/ckfinder/';//ckfinder所在路径
            finder.callback = function (api) {//ckfinder创建时函数
                var toolId = api.addToolPanel('<h3>My tool</h3><p>Sample content.</p>');
                var toolId2 = api.addTool('<h3>My tool2</h3><p>Sample content.</p>');
                // Show tool
                api.showTool(toolId);
                api.showTool(toolId2);
            }

             api = finder.popup(); //调用ckfinder
            //alert("bb");
           // window.setTimeout(function () { api.closePopup(); }, 5000);
           
        }
        function closeServer() {//ckfinder关闭函数
            api.closePopup(function () {
                alert("按钮关闭");
            });
        }
        function destroyServer() {//ckfinder销毁函数
            api.destroy(function () {
                alert('The CKFinder instance was destroyed.');
            });
        }
        $(function () {
            $("#btnAdd").click(function () {
                BrowseServer("aa");
            });
            $("#btnClose").click(function () {
                closeServer();//关闭弹出对话框
                destroyServer();//销毁api
            });
            $("#btnDestroy").click(function () {
                destroyServer();
            });
        });
    </script>

2.添加调用按钮

    <div>
        <input type="button" id="btnAdd" value="上传" />
        <input type="button" id="btnClose" value="关闭"/>
        <input type="button" id="btnDestroy" value="销毁"/>
    </div>

3.点击上传按钮弹出ckfinder对话框之后点击关闭按钮将会关闭ckfinder对话框并销毁对话框

显示信息如下图