DWZ(二):常用组件了解

2024-02-17 16:38
文章标签 组件 常用 了解 dwz

本文主要是介绍DWZ(二):常用组件了解,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

       上篇博客中我们大致明白了DWZ框架,以及它的一些优势,接下来的这篇博客是详细介绍了DWZ框架中一些常用组件的使用。

       常用组件列表:


       Ajax 链接扩展
    <a href=”xxx” target=“ajax” [rel=“boxId”]>

    示例: <a href="w_alert.html" target="ajax" rel="container">提示窗口</a>


      当前 navTab 中链接 ajax post 扩展

    <a href="user.do?method=remove" target="ajaxTodo">删除</a>
    或
<a href="user.do?method=remove" target="ajaxTodo" title="确定要删除吗?">删除</a>

                                          


       Title 为可选项,如果设置,点击后将调用 alertMsg.confirm 与用户交互确认或取消,Title 值为提示信
息.Target 值为 ajaxTodo 时会自动关联如下 JS。
   

       dialog 链接扩展
      <a href=”xxx” target=“dialog” [rel=“dialogId”]>
       a 所指向页面将会在 dialog 弹出层中打开,rel 标识此弹出层的 ID,rel 为可选项。
       Html 标签扩展方式示例:
       <a href="w_dialog.html" target="dialog" rel="page2">弹出窗口</a>
       或<a href="demo_page1.html" target="dialog" [max=true, mask=true, maxable=true, minable=true,
resizable=true,drawable=true] rel="dlg_page1" title="[自定义标题]" width="800" height="480">打开窗口一</a>

        Max 属性表示此dialog打开时默认最大化, mask表示打开层后将背景遮盖.

        maxable:dialog 是否可最大化,
        minable:dialog 是否可最小化,
        mixable:dialog 是否可最大化
        resizable: dialog 是否可变大小
        drawable: dialog 是否可拖动
        width:dialog 打开时的默认宽度
        height:dialog 打开时默认的高度
        width,height分别打开dialog时的宽度与高度.
        fresh:重复打开dialog时是否重新载入数据,默认值true,
        close:关闭dialog时的监听函数,需要有boolean类型的返回值,
        param:close监听函数的参数列表,以json格式表示,例{msg:’message’}
        关闭窗口:在弹出窗口页面内放置<button class="close" value="关闭"></button>即可。


        JS 调用方式示例:
       $.pdialog.open(url, dlgId, title);
       或$.pdialog.open(url, dlgId, title, options);
       options:{width:100px,height:100px,max:true,mask:true,mixable:true,minable:true,resizable:true,drawable:true,fresh:true,close:”function”, param:”{msg:’message’}”}, 所有参数都是可选项。
       关闭dialog层:$.pdialog.close(dialog); 参数dialog可以是弹出层jQuery对象或者是打开dialog层时的dlgId.
或者$.pdialog.closeCurrent(); 关闭当前活动层。
       $.pdialog.reload(url,data,dlid) 刷新dlid指定的dialog,url:刷新时可重新指定加载数据的url, data:为
加载数据时所需的参数。


       navTab 链接扩展
       <a href=”xxx” target=“navTab” [rel=“tabId”]>
       示例:
        <a href="url" target="navTab" >默认页面</a>
        <a href="url" target="navTab" rel="page1" title="自定义标签名" fresh="false">自定义页面</a>
        <a href="url" target="navTab" external="true">iframe 方式打开</a>


        target=navTab: 自动关联调用 navTab 组件
        rel: 为 navtab 的 ID 值,后续可以用来重载该页面时使用,如当前页新增或删除数据可以通过该 ID 进行通知 JS
重载。注意 rel 的值区分大小写.
        fresh: 表示重复打开 navTab 时是否重新加载数据
        external: 为 external="true"或者 href 是外网连接时,以 iframe 方式打开 navTab 页面


        Js 调用
        navTab.openTab(tabid, url, { title:”New Tab”, fresh:false, data:{} });
        其中 data:{} json 格式的数据
        Tab 组件扩展
        开发人员不需写任何 javacsript, 只要使用下面的 html 结构就可以.


        

         容器高度自适应
         容器高度自适应, 只要增加扩展属性 layoutH=”xx”, 单位是像素.
         LayoutH 表示容器内工具栏高度. 浏览器窗口大小改变时容器高度自适应, 但容器内工具栏高度是固定的, 需要告诉js 工具栏高度来计算出内容的高度.
         示例:
         <div class=”layoutBox”>
                 <div layoutH=“150”>内容</div>
         </div>
         注意: layoutH=“150”的高度是根据含有 class=”layoutBox”的父容器 div 动态更新的.

        只是DWZ框架中的一些组件的使用,接下来用到了继续介绍~


这篇关于DWZ(二):常用组件了解的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/718370

相关文章

Spring Boot中WebSocket常用使用方法详解

《SpringBoot中WebSocket常用使用方法详解》本文从WebSocket的基础概念出发,详细介绍了SpringBoot集成WebSocket的步骤,并重点讲解了常用的使用方法,包括简单消... 目录一、WebSocket基础概念1.1 什么是WebSocket1.2 WebSocket与HTTP

golang中reflect包的常用方法

《golang中reflect包的常用方法》Go反射reflect包提供类型和值方法,用于获取类型信息、访问字段、调用方法等,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值... 目录reflect包方法总结类型 (Type) 方法值 (Value) 方法reflect包方法总结

C# 比较两个list 之间元素差异的常用方法

《C#比较两个list之间元素差异的常用方法》:本文主要介绍C#比较两个list之间元素差异,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录1. 使用Except方法2. 使用Except的逆操作3. 使用LINQ的Join,GroupJoin

python常用的正则表达式及作用

《python常用的正则表达式及作用》正则表达式是处理字符串的强大工具,Python通过re模块提供正则表达式支持,本文给大家介绍python常用的正则表达式及作用详解,感兴趣的朋友跟随小编一起看看吧... 目录python常用正则表达式及作用基本匹配模式常用正则表达式示例常用量词边界匹配分组和捕获常用re

gitlab安装及邮箱配置和常用使用方式

《gitlab安装及邮箱配置和常用使用方式》:本文主要介绍gitlab安装及邮箱配置和常用使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录1.安装GitLab2.配置GitLab邮件服务3.GitLab的账号注册邮箱验证及其分组4.gitlab分支和标签的

Python常用命令提示符使用方法详解

《Python常用命令提示符使用方法详解》在学习python的过程中,我们需要用到命令提示符(CMD)进行环境的配置,:本文主要介绍Python常用命令提示符使用方法的相关资料,文中通过代码介绍的... 目录一、python环境基础命令【Windows】1、检查Python是否安装2、 查看Python的安

python判断文件是否存在常用的几种方式

《python判断文件是否存在常用的几种方式》在Python中我们在读写文件之前,首先要做的事情就是判断文件是否存在,否则很容易发生错误的情况,:本文主要介绍python判断文件是否存在常用的几种... 目录1. 使用 os.path.exists()2. 使用 os.path.isfile()3. 使用

Spring组件实例化扩展点之InstantiationAwareBeanPostProcessor使用场景解析

《Spring组件实例化扩展点之InstantiationAwareBeanPostProcessor使用场景解析》InstantiationAwareBeanPostProcessor是Spring... 目录一、什么是InstantiationAwareBeanPostProcessor?二、核心方法解

C++ RabbitMq消息队列组件详解

《C++RabbitMq消息队列组件详解》:本文主要介绍C++RabbitMq消息队列组件的相关知识,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录1. RabbitMq介绍2. 安装RabbitMQ3. 安装 RabbitMQ 的 C++客户端库4. A

Java实现本地缓存的常用方案介绍

《Java实现本地缓存的常用方案介绍》本地缓存的代表技术主要有HashMap,GuavaCache,Caffeine和Encahche,这篇文章主要来和大家聊聊java利用这些技术分别实现本地缓存的方... 目录本地缓存实现方式HashMapConcurrentHashMapGuava CacheCaffe