`
nikofan
  • 浏览: 226408 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类

jQuery MiniUI 开发教程 导航控件 ToolBar:工具栏(一)

阅读更多
ToolBar:工具栏


参考示例:ToolBar:工具栏

创建工具栏
<div class="mini-toolbar">
    <a class="mini-button" iconCls="icon-add">增加</a>
    <a class="mini-button" iconCls="icon-edit">修改</a>
    <a class="mini-button" iconCls="icon-remove">删除</a>
    <span class="separator"></span>
    <a class="mini-button" plain="true">增加</a>
    <a class="mini-button" plain="true">修改</a>
    <a class="mini-button" plain="true">删除</a>
    <span class="separator"></span>
    <input class="mini-textbox" />  
    <a class="mini-button" plain="true">查询</a>
</div>

复杂工具栏
<div id="toolbar1" class="mini-toolbar" style="padding:2px;">
    <table style="width:100%;">
        <tr>
        <td style="width:100%;">
            <a class="mini-menubutton" plain="true" menu="#popupMenu">文件</a>
            <a class="mini-button" iconCls="icon-addfolder" plain="true" enabled="false">增加</a>
            <a class="mini-button" iconCls="icon-edit" plain="true">修改</a>
            <a class="mini-button" iconCls="icon-remove" plain="true">删除</a>
            <span class="separator"></span>
            <a class="mini-button" iconCls="icon-reload" plain="true">刷新</a>
            <a class="mini-button" iconCls="icon-download" plain="true">下载</a>
        </td>
        <td style="white-space:nowrap;"><label style="font-family:Verdana;">Filter by: </label>
            <input class="mini-textbox" />
            </td>
        </tr>
    </table>
</div>

0
0
分享到:
评论

相关推荐

    jQuery EasyUI使用教程:为数据网格创建复杂工具栏.docx

    在本教程中,我们将深入探讨如何利用 jQuery EasyUI 为数据网格创建功能丰富的复杂工具栏。 首先,让我们了解工具栏的基本概念。工具栏(Toolbar)通常位于组件的顶部或底部,用于放置各种操作按钮或控件,以增强...

    jQuery mobile美化的菜单栏控件

    jQuery Mobile 的菜单栏控件,通常被称为“工具栏”(toolbar),分为顶部工具栏(header)和底部工具栏(footer)。这些工具栏可以包含各种元素,如标题、按钮、菜单等,提供了一种统一的方式来组织和美化页面内容...

    asp.net如何使用工具栏控件

    在ASP.NET中,工具栏控件(Toolbar)是一种常用的用户界面元素,它提供了多种功能按钮,帮助用户快速执行常见操作。在本教程中,我们将深入探讨如何在ASP.NET项目中有效地使用工具栏控件。 首先,我们需要理解ASP...

    [原创]基于JQUERY的可绑定菜单列的工具栏控件

    花生米AJAX-UI系列之:基于JQUERY的GooToolbar工具栏类UI控件0.1版 特点: 可定义四个边框有没有显示 可定义多个工具栏组,每个工具栏组可以有WIN7和经典两种样式 内置的按钮有标准按钮、可选中按钮、纯下拉菜单、...

    asp.net 制作工具栏源码

    在ASP.NET中,工具栏(Toolbar)通常指的是页面上的一排按钮或链接,用于执行常见任务,提供用户友好的界面。在VB(Visual Basic)编程环境中,我们可以使用ASP.NET来设计和实现这样的工具栏。 在这个“asp.net ...

    JToolBar JAVA工具栏

    工具栏是图形用户界面中常见的一种元素,通常位于窗口顶部,包含一系列按钮或其他控件,用于快速访问常用功能。在 Java 的 Swing 框架中,`JToolBar` 提供了创建和管理工具栏的功能。 #### 二、基本概念与创建 1. ...

    课题-jQuery-LigerUI-使用教程入门篇.pdf

    2. **导航组件**:包括Menu(菜单)、MenuBar(菜单栏)、ToolBar(工具栏),用于构建页面的导航结构。 3. **布局组件**:如Layout(布局)、Tab(标签页),帮助组织和管理页面内容。 4. **表单组件**:Form(表单...

    ReportViewer工具栏功能扩展[手动设置打印/导出按钮]

    首先,我们定义了一个名为 `ReportViewAddTool` 的 jQuery 插件方法,该方法用于在 ReportViewer 工具栏中动态添加自定义按钮。以下为核心代码片段: ```javascript // 定义 ReportViewer 控件增加工具按钮的插件...

    利用js实现的日期组件toolbar

    "利用js实现的日期组件toolbar"是一个旨在简化日期选择过程并提供自定义功能的工具栏。在这个项目中,我们将深入探讨如何使用JavaScript(可能结合jQuery库)来创建一个功能丰富的日期选择组件。 首先,我们来看看...

    jQuery EasyUI 1.3 中文离线帮助手册

    - **工具栏(Toolbar)**:在页面顶部或底部放置一系列按钮,通常与表格或表单结合使用。 3. **数据绑定**:jQuery EasyUI 支持JSON数据格式,可以方便地将服务器端数据绑定到前端组件,实现动态交互。 4. **事件...

    jQueryEasyUI.rar

    Toolbar(工具栏)组件则用于在页面顶部或侧边添加一系列按钮,执行特定功能。 6. **其他组件**: 还有诸如 Pagination(分页)、Tree(树形控件)、Accordion(手风琴)和Tabs(选项卡)等组件,它们在各种应用场景...

    jQuery EasyUI 常用UI组件.RAR

    jQuery EasyUI 是一个基于 jQuery 的前端开发框架,它提供了一系列易于使用的UI组件,极大地简化了网页界面的构建过程。这个RAR文件包含的是jQuery EasyUI的常用UI组件,版本为1.0.5。以下是关于jQuery EasyUI及其...

    课题-jQuery-LigerUI-使用教程入门篇.doc

    2. **导航组件**:包括Menu(菜单)、MenuBar(菜单栏)、ToolBar(工具栏),用于构建页面的导航结构。 3. **布局组件**:如Layout(布局)、Tab(标签页)帮助组织和分隔页面内容。 4. **表单组件**:Form(表单)...

    jquery-easyui-1.3.5 中文离线API

    EasyUI 的核心在于它的组件系统,这些组件包括但不限于:对话框(dialog)、表格(datagrid)、表单(form)、菜单(menu)、工具栏(toolbar)、树形控件(tree)、下拉树(combotree)、下拉列表(combobox)等。...

    jquery.easyui.min DEMO

    7. **工具栏(Toolbar)**:与Button类似,Toolbar组件提供了更灵活的布局和组合方式,常用于顶部或底部的操作区域。DEMO会演示如何在工具栏上添加按钮、分割线等元素。 8. **滑块(Slider)**:Slider用于创建滑动选择...

    jquery-easyui-1.4.2 Demo

    8. **Button**、**LinkButton** 和 **ToolBar**:创建各种按钮和工具栏。 通过这些示例,开发者可以快速上手并了解如何在实际项目中使用EasyUI。此外,还可以学习到如何通过JavaScript和CSS自定义EasyUI组件的样式...

    Spin_Slide_ToolBar.rar_带Spin

    "Spin_Slide_ToolBar.rar_带Spin"这个压缩包文件包含了一个特别设计的工具栏,它集成了微调器(Spin)和滑动条(Slider)控件,为用户提供了一种既美观又实用的交互方式。 首先,我们来讨论“Spin”控件,也称为...

    jQuery Mobile权威指南.pdf )

    - **工具栏(Toolbar)**:包括头部和底部工具栏,可用于放置导航按钮和标题等。 - **列表视图(List View)**:展示项目列表,支持多种样式。 - **滑块(Slider)**和**进度条(Progress Bar)**:交互式控件,常用于进度...

    jquery easyui API文档

    - **工具栏(Toolbar)**:提供一组操作按钮,用于执行常用的操作。 - **菜单(Menu)**:提供一个下拉式菜单,用于放置多个菜单项。 - **分页(Pager)**:用于控制网格中的分页。 #### 三、jQuery EasyUI 使用...

    jQuery EasyUI v1.3.5官方API中文版

    - **其他组件**:包括按钮(Button)、工具栏(Toolbar)、面板(Panel)、布局(Layout)、树形控件(Tree)、进度条(Progress Bar)、提示框(Tooltip)等,丰富了用户界面的元素。 3. **CSS 样式与主题** jQuery EasyUI ...

Global site tag (gtag.js) - Google Analytics