DISCUZ 前端JS showWindow函数解析，打造个性的弹窗

𝕷𝖎𝖑𝖏𝖆𝖈𝖐 · 发表于 2023-5-30 22:15:26

马上注册，免费下载更多dz插件网资源。

您需要登录才可以下载或查看，没有账号？立即注册

×

showWindow(k, url, mode, cache, v)

以下列表说明各个参数的含义

key	默认值	含义	可选值及解释
k	(必填)	浮窗的 key
url	(必填)	get 方式 url 表示浮窗请求的地址 post 方式 url 表示浮窗提交的表单 id
mode	'get'	弹窗请求类型	get: ajaxget 方式请求 url post: ajaxpost 方式请求 url
cache	1	是否缓存弹窗内容	1:是 0:否
v		由于 showWindow() 是以 showMenu() 函数为内核，因此此处可微调 showMenu() 参数，如不指定则使用 showWindow() 的默认值

提示：
1.同一页面同时可以弹出多个浮窗，但 k 及 url 相同的浮窗同时只能显示一个。
2.浮窗标题区域支持拖拽。
3.另外关闭浮窗请使用 hideWindow(k)。

为了方便说明如何利用这个函数开发，打造个性的弹窗页面，我们来看看主题列表页发帖按钮的弹窗机制：

在forumdisplay页面上的发帖按钮有一个onclick的触发点，触发的函数为showWindow('newthread', 'forum.php?mod=post&action=newthread&fid=40')，其中'newthread'是表示弹出窗口的div的id，'forum.php?mod=post&action=newthread&fid=40'表示请求的地址。

在这个例子中，请求返回的是htm模板，值得注意的是，返回的应该是完整的模板文件，必须包含

[color=rgb(51, 102, 153) !important]复制代码
或者

[color=rgb(51, 102, 153) !important]复制代码
以及

[color=rgb(51, 102, 153) !important]复制代码
或者

[color=rgb(51, 102, 153) !important]复制代码
这样才能在窗口内正常显示。

我们来看看标准的弹窗包括三个部分：
标题部分：

[color=rgb(51, 102, 153) !important]复制代码

在标题的后面可以附上关闭窗口的代码：

[color=rgb(51, 102, 153) !important]复制代码
内容部分：
可以自行设计。
附上提示的代码：

[color=rgb(51, 102, 153) !important]复制代码
class属性为alert_right，alert_error分别对应正确和错误的图标

按钮部分：
可以自行设计。

到此为止，showWindow函数的基本的使用方法介绍完毕了，这里只是抛砖引玉，希望能为大家在discuz!的开发和学习的路上提供一些帮助~

弹窗定时关闭

这些都是在程序端的showmessage()函数控制的，showmessage($message, $url_forward = '', $values = array(), $extraparam = array(), $custom = 0)，其中$extraparam以array(key => value ...)的形式，配置输出的模式。
举个例子：
实现倒数自动关闭--
showmessage('', '', '',  array('showdialog' => true, 'closetime' => true));
howdialog       关闭原弹出框显示 showDialog 信息
timeout             定时跳转

©dz插件网所发布的一切资源仅限用于学习和研究目的；不得将上述内容用于商业或者非法用途，否则，一切后果请用户自负。
本站信息来自网络，版权争议与本站无关。您必须在下载后的24个小时之内，从您的电脑中彻底删除上述内容。如果您喜欢该程序，请支持正版软件，得到更好的正版服务。
如有侵权请邮件与我们联系处理:discuz-x@qq.com（手机随时接收邮件）并出示相关证明以便删除。敬请谅解！

DISCUZ 前端JS showWindow函数解析，打造个性的弹窗

马上注册，免费下载更多dz插件网资源。

相关帖子

回复

More猜你喜欢

关于我们

服务支持

discuzaddons@vip.qq.com