Learning Path
浏览 jQuery EasyUI 相关教程与章节。
HTML、CSS、JavaScript、浏览器 API、前端框架与 UI 工程。
教程
118
pre { white-space: pre-wrap; } jQuery EasyUI 表单 - 过滤下拉数据网格 下拉数据网格（Combogrid）组件和下拉框（Combobox）组件的共同点是，除了都具有下拉面板以外，它们都是基于数据网格（Datagrid）的。 下拉数据网格（Combogrid）组件可以过滤、分页，并具有其他一些数据网格（Datagrid）的功能。 本教程向您展示如何在一个下拉数据网格（Combogrid..
pre { white-space: pre-wrap; } jQuery EasyUI 布局 - 创建折叠面板 在本教程中，您将会学习到关于 easyui 折叠面板（Accordion）的知识。 折叠面板（Accordion）包含一系列的面板（panel）。 所有面板（panel）的头部（header）都是可见的，但是一次仅仅显示一个面板（panel）的 body 内容。 当用户点击面板（panel）的头部（header）时，..
pre { white-space: pre-wrap; } jQuery EasyUI 布局 - 为网页创建边框布局 边框布局（border layout）提供五个区域：east、west、north、south、center。以下是一些通常用法： north 区域可以用来显示网站的标语。 south 区域可以用来显示版权以及一些说明。 west 区域可以用来显示导航菜单。 east 区域可以用来显示一些推广的项目。 ..
pre { white-space: pre-wrap; } jQuery EasyUI 布局 - 在面板中创建复杂布局 面板（Panel）允许您创建用于多种用途的自定义布局。在本实例中，我们使用面板（panel）和布局（layout）插件来创建一个 msn 消息框。 我们在区域面板中使用多个布局（layout）。在消息框的顶部我们放置一个查询输入框，同时在右边放置一个人物图片。在中间的区域我们通过设置 split 属性为 ..
pre { white-space: pre-wrap; } jQuery EasyUI 布局 - 创建标签页（Tabs） 本教程将向您演示如何使用 easyui 创建一个 Tabs 组件。 Tabs 有多个可以动态地添加或移除的面板（panel）。 您可以使用 Tabs 来在相同的页面上显示不同的实体。 Tabs 一次仅仅显示一个面板（panel），每个面板（panel）都有标题、图标和关闭按钮。 当 Tabs 被选中时，..
pre { white-space: pre-wrap; } jQuery EasyUI 布局 - 动态添加标签页（Tabs） 通过使用 jQuery EasyUI 可以很容易地添加 Tabs。您只需要调用 'add' 方法即可。 在本教程中，我们将使用 iframe 动态地添加显示在一个页面上的 Tabs。 当点击添加按钮，一个新的 tab 将被添加。如果 tab 已经存在，它将被激活。 步骤 1：创..
pre { white-space: pre-wrap; } jQuery EasyUI 布局 - 添加自动播放标签页（Tabs） 本教程将向您展示如何创建一个自动播放的 Tabs。 Tabs 组件显示第一个 tab 面板，然后显示第二个、第三个... 我们将写一些代码来自动地切换 tab 面板，然后让它循环。 步骤 1：创建 Tabs ..
pre { white-space: pre-wrap; } jQuery EasyUI 布局 - 创建 XP 风格左侧面板 通常情况下，在 Windows XP 的资源管理器文件夹中，左侧的面板（panel）包含一些常见任务。 本教程向您展示如何通过 easyui 的面板（panel）插件来创建 XP 左侧面板。 定义一些面板（panel） 我们定义一些面板（panel），这些面板（panel）用来显示一些任务。每个面板..
pre { white-space: pre-wrap; } jQuery EasyUI 菜单与按钮 - 创建链接按钮（Link Button） 通常情况下，使用 <button> 元素来创建按钮，而链接按钮（Link Button）则是使用 <a> 元素来创建的。所以实际上一个链接按钮（Link Button）就是一个显示为按钮样式的 <a> 元..
pre { white-space: pre-wrap; } jQuery EasyUI 菜单与按钮 - 创建简单的菜单 菜单（Menu）定义在一些 DIV 标记中，如下所示： New Open Word Excel PowerPoint Save Exit 当菜单创建之后是不显示的，调用 'show' 方法显示它或者..
pre { white-space: pre-wrap; } jQuery EasyUI 菜单与按钮 - 创建菜单按钮（Menu Button） 菜单按钮（Menu Button）包含一个按钮（button）和一个菜单（menu）组件，当点击或移动鼠标到按钮上，将显示一个对应的菜单。 为了定义一个菜单按钮（Menu Button），您应该定义一个链接按钮（Link Button）和一个菜单（menu），下面是一个实例： ..
pre { white-space: pre-wrap; } jQuery EasyUI 菜单与按钮 - 创建分割按钮（Split Button） 分割按钮（Split Button）包含一个链接按钮（Link Button）和一个菜单（Menu）。当用户点击或者鼠标悬停在向下箭头区域，将会显示一个对应的菜单。本实例演示了如何创建和使用分割按钮（Split Button）。 我们创建一个分割按钮（Split Button）..
jQuery EasyUI 扩展 Portal（制作图表、列表、球形图等） 数据网格视图（DataGrid View） 可编辑的数据网格（Editable DataGrid） 可编辑的树（Editable Tree） 数据网格行过滤（DataGrid Filter Row） 数据网格行拖放（Drag and Drop Rows in DataGrid） 树形网格行拖放（Drag and Drop Rows..
pre { white-space: pre-wrap; } jQuery EasyUI 插件 jQuery EasyUI 提供了用于创建跨浏览器网页的完整的组件集合，包括功能强大的 datagrid（数据网格）、treegrid（树形表格）、 panel（面板）、combo（下拉组合）等等。 用户可以组合使用这些组件，也可以单独使用其中一个。 插件列表 Base（基础） Parser 解析器 Easyloader..
pre { white-space: pre-wrap; } jQuery EasyUI 树形菜单 - 使用标记创建树形菜单 一个树形菜单（Tree）可以从标记创建。easyui 树形菜单（Tree）也可以定义在 <ul> 元素中。无序列表的 <ul> 元素提供一个基础的树（Tree）结构。每一个 <li> 元素将产生一个树节点，子 &l..
pre { white-space: pre-wrap; } jQuery EasyUI 树形菜单 - 创建异步树形菜单 为了创建异步的树形菜单（Tree），每一个树节点必须要有一个 'id' 属性，这个将提交回服务器去检索子节点数据。 创建树形菜单（Tree） 服务器端代码 $id = isset($_POST['id']) ? intval($_POST['..
pre { white-space: pre-wrap; } jQuery EasyUI 树形菜单 - 树形菜单添加节点 本教程向您展示如何附加节点到树形菜单（Tree）。我们将创建一个包含水果和蔬菜节点的食品树，然后添加一些其他水果到已存在的水果节点。 创建食品树 首先，我们创建食品树，代码如下所示： 请注意，树（Tree)组件是定义在 <ul> 标记中，树节点数据从 URL &..
pre { white-space: pre-wrap; } jQuery EasyUI 树形菜单 - 创建带复选框的树形菜单 easyui 的树（Tree）插件允许您创建一个复选框树。如果您点击一个节点的复选框，这个点击的节点信息将向上和向下继承。例如：点击 'tomato' 节点的复选框，您将会看见 'Vegetables' 节点现在仅仅选中部分。 创建复选框树 下载 ..
pre { white-space: pre-wrap; } jQuery EasyUI 树形菜单 - 树形菜单拖放控制 当在一个应用中使用树（Tree）插件，拖拽（drag）和放置（drop）功能要求允许用户改变节点位置。启用拖拽（drag）和放置（drop）操作，所有您需要做的就是把树（Tree）插件的 'dnd' 属性设置为 true。 创建树形菜单（Tree） $('#tt'..
pre { white-space: pre-wrap; } jQuery EasyUI 树形菜单 - 树形菜单加载父/子节点 通常表示一个树节点的方式就是在每一个节点存储一个 parentid。 这个也被称为邻接列表模型。 直接加载这些数据到树形菜单（Tree）是不允许的。 但是我们可以在加载树形菜单之前，把它转换为标准标准的树形菜单（Tree）数据格式。 树（Tree）插件提供一个 'loadFilter'..
pre { white-space: pre-wrap; } jQuery EasyUI 树形菜单 - 创建基础树形网格 树形网格（TreeGrid）组件从数据网格（DataGrid）继承，但是允许在行之间存在父/子节点关系。许多属性继承至数据网格（DataGrid），可以用在树形网格（TreeGrid）中。为了使用树形网格（TreeGrid），用户必须定义 'treeField' 属性，指明哪个字段作为树节点..
pre { white-space: pre-wrap; } jQuery EasyUI 树形菜单 - 创建复杂树形网格 树形网格（TreeGrid）可以展示有限空间上带有多列和复杂数据电子表格。本教程将演示如何将表格数据排列在分割的网格和多行表头中，以便组织共同的数据。 创建树形网格（TreeGrid） Region 2009 2010 ..
pre { white-space: pre-wrap; } jQuery EasyUI 树形菜单 - 树形网格动态加载 动态加载树形网格有助于从服务器上加载部分的行数据，避免加载大型数据的长时间等待。本教程将向您展示如何创建带有动态加载特性的树形网格（TreeGrid）。 创建树形网格（TreeGrid） Name Quantity Price Total ..
pre { white-space: pre-wrap; } jQuery EasyUI 树形菜单 - 树形网格添加分页 本教程展示如何向带有动态加载特性的树形网格（TreeGrid）添加分页。 创建树形网格（TreeGrid） 启用树形网格（TreeGrid）的分页特性，必须添加 'pagination:true' 属性，这样页面加载时就会向服务器发送 'page' 和 ..