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 获取class的元素的方法 以及创建方法getElementsByClassName
Mar 11 Javascript
使用AngularJS制作一个简单的RSS阅读器的教程
Jun 18 Javascript
基于JQuery打造无缝滚动新闻步骤详解
Mar 31 Javascript
BootstrapTable与KnockoutJS相结合实现增删改查功能【一】
May 10 Javascript
js判断主流浏览器类型和版本号的简单实现代码
May 26 Javascript
jquery模拟多级复选框效果的简单实例
Jun 08 Javascript
js删除Array数组中指定元素的两种方法
Aug 03 Javascript
JS对象序列化成json数据和json数据转化为JS对象的代码
Aug 23 Javascript
详解使用React全家桶搭建一个后台管理系统
Nov 04 Javascript
JavaScript实现二叉树定义、遍历及查找的方法详解
Dec 20 Javascript
解决包含在label标签下的checkbox在ie8及以下版本点击事件无效果兼容的问题
Oct 27 Javascript
vue3 自定义图片放大器效果的示例代码
Jul 23 Vue.js
使用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
excellent!――ASCII Art(由目标图象生成ascii)
2007/02/20 PHP
php socket方式提交的post详解
2008/07/19 PHP
PHP实现通用alert函数的方法
2015/03/11 PHP
PHP的Laravel框架中使用消息队列queue及异步队列的方法
2016/03/21 PHP
PHP的PDO预定义常量讲解
2019/01/24 PHP
php查询内存信息操作示例
2019/05/09 PHP
经典的解除许多网站无法复制文字的绝招
2006/12/31 Javascript
iframe调用父页面函数示例详解
2014/07/17 Javascript
一个仿糯米弹框效果demo
2014/07/22 Javascript
angularjs学习笔记之三大模块(modal,controller,view)
2015/09/26 Javascript
js中获取 table节点各tr及td的内容简单实例
2016/10/14 Javascript
整理关于Bootstrap警示框的慕课笔记
2017/03/29 Javascript
vue-cli的eslint相关用法
2017/09/29 Javascript
jQuery实现的两种简单弹窗效果示例
2018/04/18 jQuery
JS实现方形抽奖效果
2018/08/27 Javascript
详解关于element级联选择器数据回显问题
2019/02/20 Javascript
关于Vue源码vm.$watch()内部原理详解
2019/04/26 Javascript
js实现GIF图片的分解和合成
2019/10/24 Javascript
element的el-table中记录滚动条位置的示例代码
2019/11/06 Javascript
vue学习笔记之给组件绑定原生事件操作示例
2020/02/27 Javascript
vscode中Vue别名路径提示的实现
2020/07/31 Javascript
在阿里云服务器上配置CentOS+Nginx+Python+Flask环境
2016/06/18 Python
Python父目录、子目录的相互调用方法
2019/02/16 Python
Django web框架使用url path name详解
2019/04/29 Python
python 实现GUI(图形用户界面)编程详解
2019/07/17 Python
Python实现粒子群算法的示例
2021/02/14 Python
捷克体育用品购物网站:D-sport
2017/12/28 全球购物
英国最大的纸工艺品商店:CraftStash
2018/12/01 全球购物
暑假实习求职信范文
2013/09/22 职场文书
闪闪的红星观后感
2015/06/08 职场文书
2016年度员工工作表现评语
2015/12/02 职场文书
中秋节英文祝福语句(14句)
2019/09/11 职场文书
JavaGUI模仿QQ聊天功能完整版
2021/07/04 Java/Android
MySQL创建表操作命令分享
2022/03/25 MySQL
vue数据字典取键值项目的字典问题
2022/04/12 Vue.js
教你使用Ubuntu搭建DNS服务器
2022/09/23 Servers