获取JQuery UI tabs中被选中的tabs的方法
JQuery标签事件处理实例
如果你正在使用JQuery tabs而且想从基本的功能扩展到自定义的功能,这是你最好知道如何处理JQuery的点击事件。
在这篇文章中:
1.回顾如何添加当tab被点击时的事件处理
背景:
需要了解的是,JQuery在不断修正的,很多有用的信息只针对于某一特定的老版本,JQuery已经不在支持。
在这种情况下,JQuery-ui对标签页的事件监听的支持从1.9.x的show命令切换到JQuery-UI 1.10.x的activate命令。
处理一个Tab的点击事件在JQuery-UI 1.10.x和JQuery UI 1.9.x
这是一个用于JQuery-UI 1.10.x的激活tab响应的代码片段在这个页面,将会执行你自己写的代码,当第二个tab被点击。
<script type="text/javascript" >
$(function () {
$('#tabs').tabs({
activate: function (event, ui) {
var $activeTab = $('#tabs').tabs('option', 'active');
if ($activeTab == 1) {
// HERE YOU CAN ADD CODE TO RUN WHEN THE SECOND TAB HAS BEEN CLICKED
}
}
});
});
</script>
这是早期版本的JQuery-UI使用show命令。
<script type="text/javascript" >
$(function () {
$('#tabs').tabs({
show: function (event, ui) {
var $activeTab = $('#tabs').tabs('option', 'active');
if ($activeTab == 1) {
// HERE YOU CAN ADD CODE TO RUN WHEN THE SECOND TAB HAS BEEN CLICKED
}
}
});
});
</script>
从上面的代码可以看出,JQuery的编写者可以仅仅将show改变成activate由于语法的原因。作为一个开发者,需要记住,如果一部分的JQuery的代码不起作用,最好在猜测是否有bug前,检查一下语言弃用帮助。
参考资料:
1.JQuery – Example of Tabs Event Handling
2. JQuery中文文档
获取JQuery UI tabs中被选中的tabs的方法的更多相关文章
- 解决Select2控件不能在jQuery UI Dialog中不能搜索的bug
本文使用博客园Markdown编辑器进行编辑 1.问题呈现 项目中使用了jQuery UI的Dialog控件,一般用来处理需要提示用户输入或操作的简单页面.逻辑是修改一个广告的图片和标题. 效果截图如 ...
- jquery ui dialog 中使用select2 导致select2的input失去焦点的解决方法
在jqueryUI 的dialog中使用select2,select2的input search无论怎样都获取不到焦点? 解决方法: $(document).ready(function () { $ ...
- jquery.easyui.tabs 中的首个tabs被最后tabs覆盖的问题解决方法
这是由于tabs对href重载的的问题导致,因此我们需要将href更改为其它自定义的属性即可避免此问题的发生. 解决方法如下: 第一步页面端: 循环体开始 <li> <div> ...
- vue系列之获取多选框中被选中的值
多个勾选框,绑定到同一个数组: <input type="checkbox" id="jack" value="Jack" v-mod ...
- easyui中 在子tabs中 添加新的tabs
function addToParentTab(title, url) { self.parent.addTabIgnoreExist(title, url, 'icon-cha ...
- Python编程系列---获取请求报文行中的URL的几种方法总结
在浏览器访问web服务器的时候,服务器收到的是一个请求报文,大概GET请求的格式大概如下: 先随便拿到一个请求报文,蓝色即为我们要获取的 GET /index.html HTTP/1.1 Hos ...
- jquery判断字符串中是否包含特定字符的方法总结
方法一:使用indexOf() 和lastIndexOf()方法 案例: var Cts = "bblText"; if(Cts.indexOf("Text") ...
- 160620、利用 jQuery UI 和 Ajax 创建可定制的 Web 界面
如今,网站比以往更具可定制性,允许用户更改其空间,根据自己的喜好对其进行个性化.个性化的主页或仪表板页面(例如 iGoogle.MyYahoo! 和 MyAOL)日渐普及,大多数 Web 应用程序内甚 ...
- jQuery UI dialog 參数说明
前段时间碰到个问题 jquery UI dialog弹出层 弹出多个层是 比方弹出两个层A和B B层假设显示的数据表格太大,伸到了A层的外面,那伸到A层之外的部分就看不到了,由于B层是在A层上弹出的 ...
随机推荐
- Axios使用文档总结
vue更新到2.0之后,作者就宣告不再对vue-resource更新,而是推荐的axios.Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中. 一.安装 ...
- tomcat 部署 RESTful 服务实例
1.建立简单restfule服务 参考:java 利用JAX-RS快速开发RESTful 服务实例 简单代码: package com.example; import javax.ws.rs.GET; ...
- 字符编码,pyton中的encode,decode,unicode()
1.在计算机处理的程序中,对字符的处理有两种方式:编码或译码(encoding),解码(decoding) encoding:将字符串中的字符转换到对应编码字符集对应的代码点 ...
- MySQL建表设置外键提示错误
错误内容: ERROR 1064 (42000): You have an error in your SQL syntax; check the manual that corresponds to ...
- mysql时间字段转换为毫秒格式
下面是转载的关于MySQL毫秒.微秒精度时间处理的两段篇章,留给自己和供大家参考~~ 一.MySQL 获得毫秒.微秒及对毫秒.微秒的处理 MySQL 较新的版本中(MySQL 6.0.5),也还没有产 ...
- 云计算之路-试用Azure:Azure内置的负载均衡是四层的
当初迁移至阿里云遇到的第一个问题是在程序中通过Request.UserHostAddress得到的是负载均衡(SLB)的内网IP,而不是用户的真实IP.真实IP存储在服务器变量HTTP_X_Forwa ...
- 在EXCEL中如何让一列数字变成文本格式?就是想让单元格的左上角变一个绿绿的?
如何在EXCEL中如何让一列数字变成文本格式?就是想让单元格的左上角变一个绿绿的? 解决方案:将整列单元格格式设为文本,然后,选中该列,数据--分列--完成 详细步骤: (1)选中1行或者1列,再单击 ...
- react-redux 中 connect 的常用写法
1.方式一 export default connect(({ monitorRedux })=>{ return { data: monitorRedux.data } })(Monitor) ...
- jsp 普通变量与jQuery变量之间的转换
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- 将XML格式的字符串封装成DOM对象
在java端将字符串转化为xml对象可以使用DocumentHelper.parseText(xmlReturn).getRootElement(); 在js中同样有方法可以将字符串转化为xml对象, ...