`
jiang_grails
  • 浏览: 43248 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

JqueryUI中的tabs

阅读更多

1.工程中使用了JqueryUI的Tabs,使用参考

http://jqueryui.com/demos/tabs/#option-selected

刚开始我是在参考例子的基础上进行修改的,但是每次进入界面的时候默认

显示的都是一个tab,这样用户体验很不好,假如我在某个tab中做了一些动

 

 

作,然后提交服务器,然后再此返回到这个页面的时候,就不会回到当初修

改的tab中了,经过查看其文档,找到了解决办法。

2.

<script> 
    $(function() { 
        $( "#tabs" ).tabs({ selected: ${params.num}}); 
    }); 
    </script>

如上代码所示:红色部分是自己添加的,我们在后台给其返回一个参数,这

就使这个页面显示我们想要展示的那个tab。它的值从0开始的整数。0代表一

个tab,1代表第二个,以此类推。

当我们在某个tab中做动作的时,当向后台传递数据的时候,可以将额外将

这个tab对应的数值传递过去,然后当后台向前台返回结果的时候再将这个参

数传过来,将其写在上边的代码中去。

ok,调试程序,达到了我们想要的效果。

分享到:
评论

相关推荐

    JQuery UI 中文帮助文档

    3. **调用方法**:对选中的元素调用jQuery UI提供的方法,如`$(selector).tabs()`来创建选项卡。 4. **配置选项**:可以通过参数设置组件的具体行为和外观,如`$(selector).dialog({width: 500, modal: true})`创建...

    jqueryui tabs

    要实现 `jQuery UI Tabs` 的切换功能,首先需要在项目中引入必要的文件。在提供的文件列表中,我们有 `jquery-ui.css` 和 `jquery-ui.js`,它们分别是 jQuery UI 的样式表和 JavaScript 文件。此外,还需要 jQuery ...

    jquery ui tabs paging 扩展

    使用上也非常简单,在页面中载入 jquery.ui.tabs.paging.css 和 jquery.ui.tabs.paging.js 文件,在创建 tabs 对象后再执行代码激活一下插件 $tabs.tabs('paging'); 就可以了。 压缩包内带有 demo 。

    jquery ui tabs paging 不换行

    jQuery UI Tabs Paging 是一个用来对太多的 Tab 进行分页显示的 jQuery 插件。 默认的 tabs 插件一旦 tab 过多就会换行,影响页面布局。jquery.ui.tabs.paging 的作用就在于不让其换行,在两头增加左右滑动的图片...

    jQueryui_tabs_impor.rar

    《jQuery UI中的Tabs组件详解及应用》 在Web开发领域,jQuery UI库是jQuery框架的一个重要扩展,提供了丰富的用户界面组件,其中的Tabs组件尤其受到开发者们的青睐。本篇文章将详细解析jQuery UI中的Tabs组件,包括...

    jquery ui tabs_jqgrid demo

    从给定的文件信息来看,这是一段网页代码示例,主要展示了如何在网页中集成jQuery UI Tabs和jqGrid插件。以下是对标题、描述、标签以及部分内容中涉及的关键知识点的详细解读: ### 关键知识点:jQuery UI Tabs **...

    jQuery-ui-tabs 分页相关

    在网页开发中,jQuery UI 是一个非常流行的 JavaScript 库,它扩展了 jQuery 的功能,提供了丰富的用户界面组件。其中,`jQuery-ui-tabs` 是一个用于创建美观、交互式的标签页组件。本文将深入探讨 `jQuery-ui-tabs`...

    Jquery UI Tabs插件扩展

    在jQuery UI中,可以使用`$("#tabs").tabs("add", url, title)`方法,其中`url`是新标签页的内容源,`title`是显示在标签上的文字。扩展后的版本会检查是否已经存在同名的标签,如果存在则不会重复添加,而是直接...

    JQueryUI,EasyUI一些控件的使用

    在本文中,我们将深入探讨JQueryUI和EasyUI这两个JavaScript库在创建用户界面时的一些关键控件和功能,包括表单、Tab切换以及样式切换。它们都是为了提升Web应用程序的用户体验和交互性而设计的。 首先,让我们了解...

    jquery ui tabs

    接着,可以从官方网站(https://jqueryui.com)下载jQuery UI的压缩包,其中包括CSS样式文件和JavaScript脚本。在项目中,通常需要引入以下两个文件: 1. `css/jquery-ui.min.css`:这是jQuery UI的基础样式文件,...

    jQuery UI组件 jQuery UI

    1. **Tabs(选项卡)**:jQuery UI 提供了方便的选项卡组件,可以将内容分隔成多个部分,通过选项卡切换显示,提高网页的组织性和用户体验。 2. **Accordion(手风琴)**:手风琴组件允许内容以折叠/展开的方式呈现...

    jquery ui & themes

    1. **部件(Widgets)**:jQuery UI提供了多种UI部件,如日期选择器(Datepicker)、对话框(Dialog)、滑块(Slider)、进度条(Progressbar)、标签页(Tabs)和下拉菜单(Selectmenu)等。这些部件都封装了复杂的...

    jquery.ui.tabs.js

    jquery的UI的选项卡tabs插件jquery.ui.tabs.js

    JQuery UI1.7中文文档

    **jQuery UI 1.7中文文档详解** jQuery UI 是一个基于 jQuery JavaScript 库的用户界面插件集合,它提供了一套完整的组件,包括交互、特效、小部件和主题,用于构建富有吸引力且易于使用的Web应用程序。jQuery UI ...

    JQuery UI 中文帮助文档.rar

    - **Tabs(标签页)**:将多个页面内容整合到一组可切换的标签页中,节省空间并提升用户体验。 - **Autocomplete(自动补全)**:为输入框提供自动完成功能,适用于搜索框、地址输入等。 - **Sortable(可排序)**...

    前端项目-jqueryui-touch-punch.zip

    在“前端项目-jqueryui-touch-punch”这个项目中,包含的文件可能是jQuery UI Touch Punch的源码或示例。通过解压并研究这个项目,你可以了解到如何将这两个工具结合到自己的Web应用中,以提供兼容触摸设备的用户...

    JQUERY UI 开发指南源码

    本资源是《jQuery UI 开发指南》一书中的示例源代码,对于学习和理解jQuery UI的使用具有极大的帮助。 首先,我们要了解jQuery UI的基本结构。jQuery UI的核心是其组件系统,这些组件包括但不限于:`accordion`(手...

    jQuery tabs 纵向显示

    在网页设计中,jQuery UI 的 tabs 是一个非常实用的功能,它允许我们将多个内容区域组织成可切换的选项卡,提供了一种整洁的方式来展示大量信息。然而,标准的 jQuery tabs 默认是横向排列的,但有时为了适应页面...

Global site tag (gtag.js) - Google Analytics