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對話框並銷燬對話框

顯示信息如下圖