jQuery中index()的用法分析


Posted in Javascript onSeptember 05, 2014

本文实例讲解了jQuery中index()的用法。分享给大家供大家参考之用。具体方法如下:

现在有这样一个问题:如果列表里面有N多的列表项目,我想知道我点击了哪一个应该怎么取呢?

对此,jQuery里面提供了一个index()方法 :

index(subject)

该方法搜索与参数表示的对象匹配的元素,并返回相应元素的索引值。

如果找到了匹配的元素,从0开始返回;如果没有找到匹配的元素,返回-1。

但是 API里面提供的例子貌似不对,示例如下:

<ul>
  <li><a href="#nogo">这里是一个序列</a></li>
  <li><a href="#nogo">这里是一个序列</a></li>
  <li><a href="#nogo">这里是一个序列</a></li>
  <li><a href="#nogo">这里是一个序列</a></li>
  <li><a href="#nogo">这里是一个序列</a></li>
  <li><a href="#nogo">这里是一个序列</a></li>
</ul>

如上所示,这是一个无序列表 我要点击任意一个列表项目 要求得到该项目的序列 该怎么样呢?

实现方法如下:

$(document).ready(function(){ 
$("#act li").click(function(){
  alert( $( "#act li" ).index( $(this)[0] ) );
  })
})

这里的:

$( "#act li" ).index( $(this)[0] )

非常重要!

Javascript 相关文章推荐
javascript动画效果类封装代码
Aug 28 Javascript
js网页中的(运行代码)功能实现思路
Feb 04 Javascript
JS中setTimeout()的用法详解
Apr 14 Javascript
Express.JS使用详解
Jul 17 Javascript
使用AngularJS对路由进行安全性处理的方法
Jun 18 Javascript
快速学习jQuery插件 jquery.validate.js表单验证插件使用方法
Dec 01 Javascript
Webpack打包css后z-index被重新计算的解决方法
Jun 18 Javascript
微信小程序实现工作时间段选择
Feb 15 Javascript
JavaScript实现五子棋游戏的方法详解
Jul 08 Javascript
vue项目实现多语言切换的思路
Sep 17 Javascript
Vue Element校验validate的实例
Sep 21 Javascript
Vue toFixed保留两位小数的3种方式
Oct 23 Javascript
使用jquery解析XML的方法
Sep 05 #Javascript
JavaScript避免内存泄露及内存管理技巧
Sep 05 #Javascript
javascript获取dom的下一个节点方法
Sep 05 #Javascript
原生JavaScript生成GUID的实现示例
Sep 05 #Javascript
javascript动态控制服务器控件实例
Sep 05 #Javascript
setTimeout()递归调用不加引号出错的解决方法
Sep 05 #Javascript
jQuery动态创建html元素的常用方法汇总
Sep 05 #Javascript
You might like
解决MySQL中文输出变成问号的问题
2008/06/05 PHP
PHP SQLite类
2009/05/07 PHP
zend framework配置操作数据库实例分析
2012/12/06 PHP
彻底删除thinkphp3.1案例blog标签的方法
2014/12/05 PHP
php_imagick实现图片剪切、旋转、锐化、减色或增加特效的方法
2014/12/15 PHP
PHP判断是手机端还是PC端 PHP判断是否是微信浏览器
2017/03/15 PHP
JavaScript 的方法重载效果
2009/08/07 Javascript
Mootools 1.2教程 选项卡效果(Tabs)
2009/09/15 Javascript
来自国外的14个图片放大编辑的jQuery插件整理
2010/10/20 Javascript
JavaScript获取当前页面上的指定对象示例代码
2014/02/28 Javascript
JQuery弹出层示例可自定义
2014/05/19 Javascript
javascript实现数组中的内容随机输出
2015/08/11 Javascript
JavaScript和HTML DOM的区别与联系及Javascript和DOM的关系
2015/11/15 Javascript
JavaScript学习小结之被嫌弃的eval函数和with语句实例详解
2016/08/01 Javascript
React Native基础入门之初步使用Flexbox布局
2018/07/02 Javascript
webstrom Debug 调试vue项目的方法步骤
2018/07/17 Javascript
详解处理bootstrap4不支持远程静态框问题
2018/07/20 Javascript
bootstrap 路径导航 分页 进度条的实例代码
2018/08/06 Javascript
ES6 系列之 Generator 的自动执行的方法示例
2018/10/19 Javascript
layui对工具条进行选择性的显示方法
2019/09/19 Javascript
js实现移动端轮播图滑动切换
2020/12/21 Javascript
通过代码实例展示Python中列表生成式的用法
2015/03/31 Python
Python中用PIL库批量给图片加上序号的教程
2015/05/06 Python
Python中列表的一些基本操作知识汇总
2015/05/20 Python
Java多线程编程中ThreadLocal类的用法及深入
2016/06/21 Python
python对list中的每个元素进行某种操作的方法
2018/06/29 Python
不到40行代码用Python实现一个简单的推荐系统
2019/05/10 Python
Python项目实战之使用Django框架实现支付宝付款功能
2021/02/23 Python
CSS3 text-shadow实现文字阴影效果
2016/02/24 HTML / CSS
如何实现jdbc性能优化
2012/07/30 面试题
ajax是什么及其工作原理
2012/02/08 面试题
大学毕业生通用求职信
2013/09/28 职场文书
简单的辞职信范文
2014/01/18 职场文书
大专会计自我鉴定
2014/02/06 职场文书
2014学习全国两会精神心得体会2000字
2014/03/11 职场文书
财政局长个人总结
2015/03/04 职场文书