AJAX Control Toolkit tabs 的纯Javascript演示

简介: 本文纯为大家好好学习Ajax Controltoolkit而写,有不到之处希望大家提出,以免遗祸 众人 标签零 标签一 标签二 标签三 1 11 111 ...

本文纯为大家好好学习Ajax Controltoolkit而写,有不到之处希望大家提出,以免遗祸 众人

标签零 标签一 标签二 标签三
  • 1
  • 11
  • 111
  • 1111
  • 11111
  1. 2
  2. 22
  3. 222
  4. 2222
  5. 22222
  • 3
  • 33
  • 333
  • 3333
  • 33333
  1. 4
  2. 44
  3. 444
  4. 4444
  5. 44444

运行结果: 在这显示结果

容器部分属性方法

标签属性方法 ps:如从官方下载Ajaxtoolkit源代码中316行有笔误 this._headerTab.innerHTML应该改为this._header.innerHTML


源代码下载

说明:

前提文件:

MicrosoftAjax.js

/ExtenderBase/BaseScripts.js

/Common/Common.js

/DynamicPopulate/DynamicPopulateBehavior.js

namespace AjaxControlToolkit

|-------class TabContainer Tab的容器
字段
方法
initialize 初始化
dispose 销毁
属性
get_tabs 获得当前Tab的集合
getFirstTab 获取第一个Tab
getLastTab 最后一个
getNextTab 激活者的下一个Tab
getPreviousTab 上一个
getNearestTab 得到最近的一个Tab 如果Previous和Next都存在 优先取Previou
saveClientState 将当前所有Tab的状态存在预先设置的隐藏input
get_activeTabIndex 获取当前激活的Tab的index(index 默认以0开始
set_activeTabIndex(index) 以index激活某一Tab
et_activeTab 获取当前激活的Ta
set_activeTab 激活某一TAB
get_autoPostBackId 获取autoPostBackI
set_autoPostBackId 设置autoPostBackId
get_scrollBars 获取滚动条状态
set_scrollBars 设置滚动条
|
|-----class TabPanel Tab的类
属性
get_headerText 得到tab的显示的文本
set_headerText 设置tab的文本
get_headerTab 得到tab的表首部分,即点击部分
set_headerTab 设置tab表首部分
get_enabled 得到当前tab是否正在工作
set_enabled(value)设置是当前tab是否可用
get_owner得到当前tab的拥有者
set_owner设置当前tab的拥有者
get_scrollBars当前tab是否支持滚动
set_scrollBars(value) 为当前tab设置滚动条
get_tabIndex当前tab的index
get_dynamicContextKey//设置获取动态上下文,不明
set_dynamicContextKey
get_dynamicServicePath//设置获取动态webServices路径
set_dynamicServicePath
get_dynamicServiceMethod//设置获取动态webServices 的方法
set_dynamicServiceMethod(value)
方法
add_click(handler) 为当前tab增加该click事件
remove_click(handler) 当前tab移除该click事件
raiseClick 触发当前tab的click事件
add_populating(handler) //这两组方法不太清楚作用,请教高人
remove_populating(handler)
raisePopulating
add_populated(handler)
remove_populated(handler)
raisePopulated

 

目录
相关文章
|
1月前
|
JavaScript 前端开发 容器
AJAX载入外部JS文件到页面并让其执行的方法(附源码)
AJAX载入外部JS文件到页面并让其执行的方法(附源码)
19 0
|
4月前
|
前端开发 JavaScript
js + ajax实现商品列表页到详情页的跳转
js + ajax实现商品列表页到详情页的跳转
|
5月前
|
XML JSON 前端开发
深入了解JavaScript中的AJAX和HTTP请求
深入了解JavaScript中的AJAX和HTTP请求
|
5月前
|
敏捷开发 JavaScript 前端开发
❤❤❤【Vue.js最新版】sd.js基于jQuery Ajax最新原生完整版for凯哥API版本❤❤❤
❤❤❤【Vue.js最新版】sd.js基于jQuery Ajax最新原生完整版for凯哥API版本❤❤❤
|
9天前
|
XML 前端开发 JavaScript
【JavaScript技术专栏】JavaScript网络请求与Ajax技术
【4月更文挑战第30天】Ajax是Web开发中实现动态数据更新的关键技术,允许不刷新页面即从服务器获取数据。它结合了HTML/CSS、DOM、XML/JSON和JavaScript。`XMLHttpRequest`是传统的Ajax实现方式,而`fetch` API是现代、简洁的替代选项。Ajax应用实例展示了如何使用fetch在搜索框输入时异步获取并显示结果,提升了用户体验。掌握这些技术对前端开发者至关重要。
|
17天前
|
JSON 前端开发 JavaScript
JavaScript原生实现AJAX技术详解
【4月更文挑战第22天】本文详细介绍了使用原生JavaScript实现AJAX技术,包括基本原理和步骤。AJAX借助`XMLHttpRequest`对象实现异步通信,允许网页在不刷新情况下与服务器交换数据。文中提供示例展示了如何创建请求、设置回调函数、处理响应数据以及设置请求头和发送不同类型的数据。此外,还讨论了跨域问题及其解决方案,如CORS和JSONP。掌握这些基础知识对前端开发者至关重要,尽管现代框架提供了更高级的抽象。
|
2月前
|
JavaScript 前端开发
node.js第四天--ajax在项目中的应用
node.js第四天--ajax在项目中的应用
27 0
|
2月前
|
XML 前端开发 JavaScript
node.js第三天-----ajax(3)
node.js第三天-----ajax(3)
26 0
|
2月前
|
JSON JavaScript 前端开发
node.js第三天-----ajax(2)
node.js第三天-----ajax(2)
23 0
|
2月前
|
JSON 前端开发 JavaScript
node.js第三天-----ajax(1)
node.js第三天-----ajax(1)
36 0