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 相关文章推荐
js修改table中Td的值(定义td的单击事件)
Jan 10 Javascript
JS中字符串trim()使用示例
May 26 Javascript
jquery实现鼠标滑过后动态图片提示效果实例
Aug 10 Javascript
jQuery layui常用方法介绍
Jul 25 Javascript
angularJS Provider、factory、service详解及实例代码
Sep 21 Javascript
javascript的函数劫持浅析
Sep 26 Javascript
Javascript基础回顾之(一) 类型
Jan 31 Javascript
jquery插件ContextMenu设置右键菜单
Mar 13 Javascript
jQuery模拟实现天猫购物车动画效果实例代码
May 25 jQuery
Javascript刷新页面的实例
Sep 23 Javascript
vue-router 2.0 跳转之router.push()用法说明
Aug 12 Javascript
微信小程序canvas实现签名功能
Jan 19 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
初探PHP5
2006/10/09 PHP
PHP使用适合阅读的格式显示文件大小的方法
2015/03/05 PHP
浏览器兼容console对象的简要解决方案分享
2013/10/24 Javascript
jquerydom对象的事件隐藏显示和对象数组示例
2013/12/10 Javascript
jQuery 设置 CSS 属性示例介绍
2014/01/16 Javascript
Jquery获取和修改img的src值的方法
2014/02/17 Javascript
JavaScript中数据结构与算法(一):栈
2015/06/19 Javascript
深入理解Node.js 事件循环和回调函数
2016/11/02 Javascript
JavaScript对象封装的简单实现方法(3种方法)
2017/01/03 Javascript
vue学习笔记之v-if和v-show的区别
2017/09/20 Javascript
Angular2学习笔记之数据绑定的示例代码
2018/01/03 Javascript
使用async await 封装 axios的方法
2018/07/09 Javascript
vue实现学生录入系统之添加删除功能
2018/07/11 Javascript
深入理解JavaScript 中的匿名函数((function() {})();)与变量的作用域
2018/08/28 Javascript
JavaScript中工厂函数与构造函数示例详解
2019/05/06 Javascript
解决Vue项目打包后打开index.html页面显示空白以及图片路径错误的问题
2019/10/25 Javascript
vue+elementUI(el-upload)图片压缩,默认同比例压缩操作
2020/08/10 Javascript
js实现批量删除功能
2020/08/27 Javascript
[05:06]TI4西雅图DOTA2前线报道 海涛密探LGD训练
2014/07/09 DOTA
[02:17]TI4西雅图DOTA2前线报道 啸天mik夫妻档解说
2014/07/08 DOTA
[05:23]DOTA2-DPC中国联赛2月1日Recap集锦
2021/03/11 DOTA
Django实战之用户认证(初始配置)
2018/07/16 Python
Python 利用pydub库操作音频文件的方法
2019/01/09 Python
用Python从0开始实现一个中文拼音输入法的思路详解
2019/07/20 Python
使用Tensorflow实现可视化中间层和卷积层
2020/01/24 Python
python实现替换word中的关键文字(使用通配符)
2020/02/13 Python
Python的控制结构之For、While、If循环问题
2020/06/30 Python
Python爬虫爬取新闻资讯案例详解
2020/07/14 Python
CSS3实现渐变背景兼容问题
2020/05/06 HTML / CSS
青年安全生产示范岗事迹材料
2014/05/04 职场文书
2014县政府领导班子三严三实对照检查材料思想汇报
2014/09/26 职场文书
镇人大副主席民主生活会对照检查材料思想汇报
2014/10/01 职场文书
医德医风个人总结
2015/02/28 职场文书
讲座开场白台词和结束语
2015/05/29 职场文书
穆斯林的葬礼读书笔记
2015/06/26 职场文书
2019年冬至:天冷暖人心的问候祝福语大全
2019/12/20 职场文书