`

使用dhtmlxTabbar,实现跳格(TAB)控制和异步请求

阅读更多

//创建tab,第2个参数代表位置

tabbar = new dhtmlXTabBar("id", "top");

tabbar.setHrefMode("ajax-html");

tabbar.preventIECashing(true);
tabbar.setImagePath("../imgs/");
tabbar.setStyle("modern");
tabbar.setOffset("15");
tabbar.setMargin("2");
tabbar.enableAutoSize(true, true);

 

tabbar.addTab("a1", "Tab1", "140px");
tabbar.addTab("a2", "Tab2", "140px");
tabbar.addTab("a3", "Tab3", "140px");

 

tabbar.setContentHref("a1", "${ctx}/test/list.do?tapId=a1");
tabbar.setContentHref("a2", "${ctx}/test/list.do?tapId=a2");

tabbar.setContentHref("a3", "${ctx}/test/list.do?tapId=a3");

 

 

tabbar.enableTabCloseButton(true);
  tabbar.setTabActive("a1");
  tabbar.forceLoad("a2");
  tabbar.forceLoad("a3");
  tabbar.setOnTabClose(myFunc);

 

//动态的赋值
     var tapId="a1";
  function myFunc() {
        tabbar.removeTab("operate");
        tabbar.setTabActive(tapId);
   }

分享到:
评论

相关推荐

    手机移动端Tab选项卡切换带下拉数据异步加载js插件

    这款特定的插件专注于Tab选项卡与下拉加载的结合,通过监听用户的切换行为和滚动事件,触发异步请求,获取并渲染新的数据。 5. **插件使用步骤** - 首先,需要在HTML结构中设置Tab选项卡和相关的数据容器。 - ...

    tab页的实现方法 实现tab

    使用纯HTML和CSS,你可以创建一个简单的Tab结构,通过CSS控制隐藏和显示内容。通过JavaScript添加交互性,比如点击Tab时切换内容。例如,可以使用`<input type="radio">`作为Tab按钮,`<div>`作为内容区,通过...

    好用的tab页实现dhtmlxTabbar

    10. **API和方法**:dhtmlxTabbar提供了详细的API文档,包含了各种方法和属性,帮助开发者实现更复杂的交互和功能,如获取当前激活的标签ID、设置标签页的属性等。 综上所述,dhtmlxTabbar是一个功能强大且灵活的...

    有ajax,jquery实现tab效果

    在`tab+ajax`的压缩包文件中,可能包含了一个示例代码或者模板,用于演示如何使用Ajax和jQuery实现Tab效果。解压后,你可以查看其中的HTML、CSS和JavaScript文件,学习并理解其工作原理。此外,可能还包含了详细的...

    jquery ajax选项卡使用jQuery选项卡切换异步加载请求数据

    为了实现异步加载数据,我们可以利用`load()`方法,该方法允许我们向服务器发送Ajax请求,并将返回的内容插入到指定的DOM元素中。当用户点击一个新的选项卡时,我们可以在切换事件中触发Ajax请求,加载对应内容。 `...

    Ace Admin Tab页实现

    在“Ace Admin Tab页实现”这个主题中,我们将深入探讨如何利用Ace框架来构建和管理Tab页功能。 Ace框架是一个轻量级、高性能的前端JavaScript库,特别适用于构建响应式的Web应用。它提供了多种UI组件,如表格、...

    使用ViewPager来实现Tab效果

    通过以上步骤,你可以成功地使用`ViewPager`和`TabLayout`在Android应用中实现Tab效果,并解决`ImageButton`不可点击的问题。同时,别忘了考虑用户体验,合理设置滑动动画和过渡效果,使界面更加流畅和自然。

    纯css3实现的tab标签切换效果

    在本文中,我们将深入探讨如何使用纯CSS3实现Tab标签切换效果。Tab切换是一种常见的用户界面设计模式,它允许用户在多个视图或内容区域之间切换,而无需刷新整个页面。这种效果通常用于展示有限数量的相关信息,如...

    js控制层和DIV+CSS实现TAB菜单

    在网页设计中,"js控制层和DIV+CSS实现TAB菜单"是一个常见的技术组合,用于创建交互式的用户界面。这个主题涉及到JavaScript(JS)、层(Layer)管理、Div(CSS布局元素)以及CSS(级联样式表)的使用。下面我们将...

    android 使用fragment 实现tab切换

    - Tab切换时,确保数据加载和更新是异步进行的,以避免阻塞UI线程。 通过以上步骤,我们可以实现一个基于Fragment的Tab切换功能,同时在每个Tab内展示一个包含ListView的数据列表。这个Demo展示了Android开发中...

    一个非常不错的Ajax实现的tab组件

    本篇将详细讲解一个使用Ajax技术实现的Tab组件,该组件能动态地加载并显示内容,避免了页面的频繁刷新,从而提升了页面性能。 一、Ajax基础 Ajax(Asynchronous JavaScript and XML)并非一种单一的技术,而是一组...

    使用Iframe实现TAB页面切换

    下面将详细探讨如何使用Iframe实现TAB页面切换,以及与之相关的知识点。 首先,理解Iframe的基本结构: ```html <iframe src="http://example.com" width="400" height="300"></iframe> ``` `src`属性指定要加载的...

    使用JQuery技术实现的tab效果

    本教程将深入探讨如何使用JQuery这一强大的JavaScript库来创建功能丰富的Tab效果,包括鼠标感应、点击切换和内容的动态加载与隐藏。 首先,我们需要理解JQuery的核心概念。JQuery是一个轻量级、高性能的JavaScript...

    基于vue多tab页实现

    在Vue.js框架中,多标签页(Tab)的实现是一个常见的需求,特别是在构建复杂的Web应用时,它能够帮助用户组织和切换不同的视图或功能。本教程将详细讲解如何使用Vue.js来创建一个简单的多标签页系统,并提供了一个...

    使用Fragment实现Tab效果

    当我们需要实现类似Tab的效果时,`Fragment`和`TabLayout`结合使用是一个常见且实用的方法。下面我们将详细介绍如何利用`Fragment`来实现Tab效果。 首先,理解`Fragment`的基本概念。`Fragment`代表了Activity中的...

    android实现两层tab嵌套

    在这个例子中,一级Tab和二级Tab都由`Fragment`实现,便于管理和动态替换。 2. `ViewPager`实现滑动切换:一级Tab间的切换通常使用`ViewPager`,它可以实现左右滑动的效果,无缝切换不同`Fragment`。 3. `TabLayout`...

    ASP.NET中异步加载数据的无刷新Tab源代码

    在ASP.NET中实现异步加载数据,首先需要在页面上添加ScriptManager控件,它是ASP.NET AJAX的基础。然后,可以创建一个或多个UpdatePanel控件,这些UpdatePanel将包含需要异步更新的UI元素。当UpdatePanel内的某个...

    Android tab的实现

    "Android tab的实现"这个主题主要是关于如何在Android应用中创建和管理Tab来提供多页面导航。通常,我们可以使用Android的TabHost、ActionBar(在API 11及以上版本)或ViewPager配合Fragment来实现Tab功能。下面将...

    Asp.net2.0实现简易菜单Tab切换

    在Asp.net 2.0框架中,开发一个简易的菜单Tab切换功能是常见的需求,尤其对于构建用户界面友好、交互性强的Web...在实际开发过程中,还可以根据需求进行扩展和优化,例如集成Ajax技术实现异步加载,提高页面响应速度。

Global site tag (gtag.js) - Google Analytics