文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

EasyUI学习笔记

collapsed boolean 定义是否在初始化的时候折叠面板。 closed boolean 定义是否在初始化的时候关闭面板。...fn大多都是以on开头的,大部分复杂组件,都可以在初始化时,使用onxxx属性配置,值为事件响应 onCollapse 折叠是触发 onExpand 展开时触发 小部分简单组件,还是使用JQuery...", //组件的事件 onCollapse:function(){ alert("折叠面板的时候触发的事件") } }); }); 的面板可以用作应用程序窗口。默认情况下,窗口可以移动,调整大小和关闭。它的内容也可以被定义为静态html或要么通过ajax动态加载。...选项卡显示一批面板。但在同一个时间只会显示一个面板。 每个选项卡面板都有头标题和一些小的按钮工具菜单， 包括关闭按钮和其他自定义按钮。 <!

11.9K30
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    最新jquery+easyui_api培训文档

    Window的事件和面板(panel)的事件相同 9.4 方法 除了”header”和”body”以外，Window的函数方法和面板(panel)的相同 10 Panel（面板） 10.1 实例 10.1.1...false border 布尔 定义面板的边框 true doSize 布尔 当设置为true，面板载创建的时候将被调整和重新布局 true collapsible 布尔 定义是否显示可折叠定义按钮 false..., height 当面板调整大小之后触发width: 新的宽度;height: 新的高度 onMove left,top 当面板移动之后触发left: 新的左侧位置top: 新的顶部位置 onMaximize...11.4 方法 方法名 参数 描述 resize none 调整标签容器的大小和布局 add options 添加新标签面板，可选参数是一个配置对象，详细信息可以查看下面的标签面板属性 close...getPager none 返回分页对象 resize none 调整表格大小 reload param 重新加载行 fixColumnSize none 固定列的大小 loadData param

    4.4K40

    easyUI的常用API

    编写组件 指定class属性即可 面板-- panel 基础面板 class属性设置为: easyui-panel title属性描述的是面板的标题 Jquery对象的api....'collapse',true: 折叠 data-options : 描述面板功能, 键值对的集合, 键与值之间使用冒号连接, 多个键值对之间使用逗号连接 collapsible:true//...将菜单的显示 , 绑定到鼠标的右键上 , 并取消原网页的右键效果 //绑定事件到右键点击上 $(document).on("contextmenu",function(e){...给菜单中的条目 添加点击事件 给最外层的菜单div添加: data-options="'onClick':函数名称" 点击事件函数的编写, 需要设计一个形式参数, 会接受到被点击的元素对象...(被指定的元素与子元素使用块级元素div) 注意, 如果需要处理点击事件, 给单个元素添加onclick即可 案例: <a href="void(0)" class="easyui-menubutton

    3.4K30

    python测试开发django-188.Bootstrap折叠（Collapse）插件

    ，点击后也可以展示 多个折叠 只需向元素添加data-toggle=”collapse”和 adata-target即可自动分配对可折叠元素的控制。...在可折叠元素实际显示或隐藏之前（即在or事件发生之前）返回给调用者。shown.bs.collapse, hidden.bs.collapse `.collapse('show') 显示可折叠元素。...在可折叠元素实际显示之前（即在事件发生之前）返回给调用者。shown.bs.collapse .collapse(‘hide’) 隐藏可折叠元素。...在可折叠元素实际被隐藏之前（即在事件发生之前）返回给调用者。hidden.bs.collapse Bootstrap 的折叠类公开了一些用于挂钩折叠功能的事件。...事件类型 描述 show.bs.collapse show调用实例方法时立即触发此事件。 shown.bs.collapse 当折叠元素对用户可见时触发此事件（将等待 CSS 转换完成）。

    4K50

    jQuery EasyUI 详解

    easyui 的布局 jq easyui 把网页分成了 上、下、左、中、右，分别对应：North、South、West、Center、East。...事件名 参数 描述 onCollapse region 当折叠区域的时候触发 onExpand region 当展开区域的时候触发 onAdd region 当添加区域的时候触发 onRemove region...('消息标题', '消息内容：折叠了面板：' + region, 'info'); }, onExpand: function (region) { $.messager.alert('...默认的 view null 列（Column）的特性 DataGrid 的 Column 是一个数组对象，它的每个元素也是一个数组。数组元素的元素是一个配置对象，它定义了每个列的字段。...事件 其事件扩展自 panel，下列是为 datagrid 增加的事件。 名称 参数 说明 onLoadSuccess data 当数据加载成功时触发。

    10.9K10

    JQuery EasyUI window 用法

    ： * 可拖放(Draggable) * 调整大小(Resizable) * 面板(panel) 下面来介绍Window的具体用法，首先来看属性大多数的属性和面板(panel)的属性是相同的 　　　　　　　　　　　　　　　　　　　　　　...false border 布尔 定义面板的边框 true doSize 布尔 当设置为true，面板载创建的时候将被调整和重新布局 true collapsible 布尔 定义是否显示可折叠定义按钮 false...事件 名字 参数 描述 onLoad none 当远程数据加载时触发 onBeforeOpen none 当面板打开之前触发 onOpen none 当面板打开之后触发 onBeforeClose none...width, height 当面板调整大小之后触发 width: 新的宽度 height: 新的高度 onMove left,top 当面板移动之后触发 left: 新的左侧位置 top: 新的顶部位置...回调函数 refresh none 当设置了href值时，刷新面板来加载远程数据 resize options 设置面板的大小和布局，这些选项包含以下的属性： width: 新面板的宽度 height:

    1.6K20

    Jump Start Bootstrap 第4章

    我们还知道一个面板有两个组件:panel-heading和panel-body。 为了创建Collapse，我们需要一组嵌在容器内的面板，这个容器是使用div元素和类面板组创建的。...与普通面板的panel-body没有包装在任何div中不同，在这里被div包裹是强制性的，以达到折叠的效果。...包裹体可以有三个类panel-collapse、collapse和in；类collapse用来折叠和隐藏面板中panel-body的内容，而in显示这些内容。...为了给模式对话框提供一个逐渐消失的效果，我们需要在这个容器中添加类fade。接下来，我们定义一个包含类modal-dialog的div元素。这是负责控制模态的大小。默认情况下，它按屏幕大小调整大小。...为了调整大小，您需要将下面的一个类添加到modal-dialog元素: modal-lg: 大型模式对话框，宽度900px modal-sm: 小型模式对话框，宽度300px Modals使用JavaScript

    35K40

    七个帮助你处理Web页面层布局的jQuery插件

    1.UI.Layout  jQuery UI布局插件 官方网站：http://layout.jquery-dev.com/index.cfm 使用大小可折叠的嵌套面板和大量选项创建高级UI布局。...布局可以创建任何你想要的UI外观; 从简单的标题或侧边栏到具有工具栏，菜单，帮助面板，状态栏，子表单等的复杂应用程序。集成并增强其他UI小部件，如选项卡，手风琴和对话框，以创建丰富的界面。 ?...resources/jquery-masonry 所有项目的大小和样式都由您自己的CSS处理。项目大小可以用响应式布局的百分比来设置 ?...一个组件是一个抽象; 它可以通过多种方式实现，例如HTML5 Canvas绘图中的项目或HTML元素。jLayout库允许您专注于绘制各个组件，而不是如何将其排列在屏幕上。...插件可以读取另个一html,也可以是当前页面中的元素，目前比较流行的导航菜单展现形式,特别是在手机端或者触屏页面,效果还是不错的 demo：http://www.jq22.com/jquery-info343

    10.4K20

    前端开发控件折叠面板（Accordion）——详解与实现

    采用折叠面板不仅能够减少页面的滚动距离，而且在视觉上能够起到分组与区分不同信息块的作用，使得整体界面更具层次感和交互性。...如此一来，不同内容区块可以根据用户的交互需求动态调整，既满足信息展示的需求，又避免了冗余信息的堆砌。在用户体验设计中，折叠面板常常被视为一种直观且高效的内容组织方式。...很多企业官网、产品介绍页面都会采用这种设计，使得用户在浏览时能够先浏览概览信息，再根据兴趣展开具体内容；在移动设备上，屏幕空间有限，采用折叠面板能够有效降低用户滚动页面的负担，改善阅读体验。...样式定义中对 panel 元素设置了 display: none，使其在初始状态下处于隐藏状态；通过 JavaScript 的事件监听，当用户点击标题按钮时，利用 classList.toggle 方法切换...此外，不同开发框架往往封装了类似的控件，例如 jQuery UI 中的 accordion 组件、 Bootstrap 中的折叠组件以及 Material-UI 中的 Accordion 组件，它们在功能上基本相似

    1.2K10

    七个帮助你处理Web页面层布局的jQuery插件

    1.UI.Layout jQuery UI布局插件 官方网站：http://layout.jquery-dev.com/index.cfm 使用大小可折叠的嵌套面板和大量选项创建高级UI布局。...布局可以创建任何你想要的UI外观; 从简单的标题或侧边栏到具有工具栏，菜单，帮助面板，状态栏，子表单等的复杂应用程序。集成并增强其他UI小部件，如选项卡，手风琴和对话框，以创建丰富的界面。...2.jQUery Masonry 官方网站：https://masonry.desandro.com/?resources/jquery-masonry 所有项目的大小和样式都由您自己的CSS处理。...一个组件是一个抽象; 它可以通过多种方式实现，例如HTML5 Canvas绘图中的项目或HTML元素。jLayout库允许您专注于绘制各个组件，而不是如何将其排列在屏幕上。...插件可以读取另个一html,也可以是当前页面中的元素，目前比较流行的导航菜单展现形式,特别是在手机端或者触屏页面,效果还是不错的 demo：http://www.jq22.com/jquery-info343

    69900

    深入理解bootstrap

    ，包括顶部 的CSS组件内部也可以任意使用这些基础组件 3.jQuery 4.响应式设计：页面的设计与开发应当根据用户行为以及设备环境（系统平台、屏幕尺寸、屏幕定向等）进行相应的响应和调整，包括弹性网格和布局...，比如使用类似于data-target的自定义属性等 2.JavaScrtip实现步骤：所有的插件都遵循jQuery插件开发的标准步骤，所有的事件都保持了统一标准 3.插件调用方法：所有插件的使用方式都非常类似...、input、textarea元素上应用了.form-control样式，显示的宽度会变成100%，并且placeholder的颜色变灰 2.内联表单：在form元素上应用.form-inline样式，...支持多种颜色 4.自定义列表组：.list-group-item-heading、.list-group-item-text S.面板 1.基础面板：.panel、.panel-default（.panel-xxx...1.data-toggle="collapse"配合data-target=""使用，折叠区域使用collapse和in样式 2.默认隐藏折叠区域，触发元素上添加一个.collapsed样式，去掉折叠区域的

    4.5K60

    探索 JQuery EasyUI：构建简单易用的前端页面

    collapsible： 设置面板是否可折叠。closable： 设置面板是否可关闭。border： 设置面板是否显示边框。3.2.2 使用示例面板的内容为 "Welcome to my panel!"，并且设置了面板标题前的图标样式为 "icon-ok"，使其显示一个勾选图标。同时，我们还设置了面板可折叠、可关闭以及显示边框等属性。...width： 设置窗口的宽度。height： 设置窗口的高度。left： 设置窗口的水平位置。top： 设置窗口的垂直位置。resizable： 设置窗口是否可调整大小。...窗口的内容为 "Welcome to my window!"，并且设置了窗口标题前的图标样式为 "icon-ok"，使其显示一个勾选图标。同时，我们还设置了窗口可拖拽移动、可调整大小以及可关闭等属性。...3.5 Tree 树形菜单组件Tree 树形菜单组件可以将数据以树状结构展示在网页上，并且提供了丰富的功能，如节点展开、折叠、选中、勾选等，使用户能够轻松地浏览和管理信息。

    3.2K10

    探索 JQuery EasyUI：构建简单易用的前端页面

    collapsible： 设置面板是否可折叠。 closable： 设置面板是否可关闭。 border： 设置面板是否显示边框。 3.2.2 使用示例 面板的内容为 “Welcome to my panel!”，并且设置了面板标题前的图标样式为 “icon-ok”，使其显示一个勾选图标。同时，我们还设置了面板可折叠、可关闭以及显示边框等属性。...width： 设置窗口的宽度。 height： 设置窗口的高度。 left： 设置窗口的水平位置。 top： 设置窗口的垂直位置。 resizable： 设置窗口是否可调整大小。...同时，我们还设置了窗口可拖拽移动、可调整大小以及可关闭等属性。...3.5 Tree 树形菜单组件 Tree 树形菜单组件可以将数据以树状结构展示在网页上，并且提供了丰富的功能，如节点展开、折叠、选中、勾选等，使用户能够轻松地浏览和管理信息。

    2.5K10

    BootStrap 前端框架简介

    响应式网格视图通常有12列，总宽度为100％，并在调整浏览器窗口大小时缩小和展开。 让我们开始构建响应式网格视图。 首先确保所有HTML元素都将box-sizing属性设置为border-box。...我们也可以根据自己的需要，定义列数： Bootstrap 4 的网格系统是响应式的，列会根据屏幕大小自动重新排列。...分页（Pagination），是一种无序列表，Bootstrap 像处理其他界面元素一样处理分页。翻页（Pager） 如果您想要创建一个简单的分页链接为用户提供导航，可通过翻页来实现。...Bootstrap 折叠（Collapse）插件 折叠（Collapse）插件可以很容易地让页面区域折叠起来。无论您用它来创建折叠导航还是内容面板，它都允许很多内容选项。...**** 创建可折叠的分组或折叠面板（accordion）*

    5.1K10
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号

      领券