ckfinder.net完全講解七(ckfinder對話框，openmsgDialog,openconfirmdialog)

本文主要介紹ckfinder幾種對話框的使用,ckfinder主要含有兩種對話框，一種是openmsgdialog,另外一種是openConfirmdialog,openmsgdialog與js中alert比較相像，而openconfirmdialog是對應js中confirm.

首先我們介紹openmsgdialog，openmsdialog主要是起提示信息的作用，彈出一個對話提示用戶。看如下代碼

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>

2.添加js代碼

<script type="text/javascript">
        var api;
        function BrowseServer(inputId) {
            var finder = new CKFinder();
            finder.basePath = 'CkEditor/ckfinder/'; //ckfinder所在路徑
            finder.callback = function (api) {//ckfinder創建時函數
                var menuItem = {
                    label: '彈出對話框',
                    command: 'open'//其他地方調用命令標識
                };
                api.addFileContextMenuOption(menuItem, function (api, file) {
                    api.openConfirmDialog("", "Are you sure?", function (value) {
                        api.openMsgDialog("Processing", "OK, processing, please wait...");
                    });
                });
            };
            api = finder.popup(); //調用ckfinder
        }
        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>

3.添加html控件

<div>
        <div id="lblInfo">
        </div>
        <input type="button" id="btnAdd" value="上傳" />
        <input type="button" id="btnClose" value="關閉" />
        <input type="button" id="btnDestroy" value="銷燬" />
    </div>

4.點擊上傳按鈕彈出ckfinder對話框，選擇一個文件右鍵點擊彈出對話框按鈕，彈出一個對話框，效果如下圖