Discuz!X3.2 Ajax 操作详解及实例(四)：showDialog() 与 showWindow()

bacy001

showDialog 与 showWindow 主要用于在前端页面输出对话框或者窗口。根据函数的名字可以知道，showDialog 主要是显示对话框，而 showWindow 可以显示窗口。其实两者主要的区别是：showDialog 只能显示 Discuz 内置的对话框，而 showWindow 可以显示用户自定义的对话框或者窗口。
关于 showDialog 与 showWindow 的参数定义，请参考：Discuz!X 通用JavaScript脚本(AJAX使用和弹层)

下文着重介绍 showDialog 与 showWindow 的应用实例。

1、实例一，使用 showDialog 显示一个确认对话框，并根据用户的选择输出不同的信息。
参考代码如下（添加到主模板文件 test.htm 即可）：

1. <a href="javascript:;" onclick="showDialog('msg', 'confirm', 'Pls Confirm', function(){alert('Confirm');},1,function(){alert('Cancel');})">showDialog Test</a>

复制代码

Note：在使用 showDialog 的时候需要注意，如果使用了 'closetime' 参数，在 X3.2 中会直接调用 showPrompt() 在页面中间显示 msg 的信息，而在 X2.5 及以前版本则还是使用对话框的形式显示 msg 信息。

2、实例二，使用 showWindow 显示一个用户自定义的窗口。
用户自定义的窗口可以使用模板的方式提供，也可以直接将 HTML 代码直接写在 PHP 程序代码中，推荐使用模板方式。
在插件的 template 目录下增加一个窗口模板文件 window.htm 参考代码如下：

1. {template common/header}
   
2. 
   
3. <h3 class="flb">
   
4.         <em>Title</em>
   
5.         <span>
   
6.                 <a href="javascript:;" class="flbc" onclick="hideWindow('test_win')" title="{lang close}">{lang close}</a>
   
7.         </span>
   
8. </h3>
   
9. 
   
10. <div style="width:400px;padding:10px;">
    
11.         <div class="bm bmw">
    
12.                 <div class="bm_c">
    
13.                         Your Formhash is : {FORMHASH}
    
14.                 </div>
    
15.         </div>
    
16. </div>
    
17. 
    
18. {template common/footer}

复制代码

其中 H3 标签内的部分，是 Discuz 内置风格的窗口头部，包括了 Title 部分和一个关闭按钮，这里需要注意的是：为了能正确关闭窗口，hideWindow() 中的第一个参数，必须与 showWindow() 的第一个参数一致，本例中为：'test_win'。
接下来是窗体部分，即 div 标签内的内容，用户可以自己的需要进行设计。

主模板文件 test.htm 中添加调用代码：

1. <a href="javascript:;" onclick="showWindow('test_win', 'plugin.php?id=test&act=sw')">showWindow Test</a>

复制代码

然后在后台主模块文件 test.inc.php 中添加对应的 case 分支用户输出窗口，参考代码如下：

1. case 'sw':
   
2. 
   
3.                 include template('test:window');
   
4. 
   
5.                 exit;
   

复制代码

Note：这里的处理方式与介绍 ajaxget 时有些不一样，让我们回顾一下在 ajaxget 的实例中后台是如何处理的，参考代码如下：

1. case 'ajaxgetstring':
   
2. 
   
3.                 sleep(2);
   
4. 
   
5.                 include template('common/header');
   
6.                 echo FORMHASH;
   
7.                 include template('common/footer');
   
8. 
   
9.                 exit;
   

复制代码

区别在于本例中没有使用 include template('common/header'); 与 include template('common/footer'); 原因是在模板 window.htm 中以及包含了 Discuz 的标准头部和尾部，这两种方式完全等效。


本节完