jQuery中index()的用法分析

本文实例讲解了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] )

非常重要！

赞 (0)

相关推荐

  • jquery根据属性和index来查找属性值并操作

    <div class="zy_menu clearfix"> <a href="javascript:;" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" re

  • JQuery index()方法使用代码

    学生科的网站首页有19个Repeater控件.6个div块的tabs切换. 做tabs切换总不能一个个去写方式吧:(代码如下....) 复制代码 代码如下: $(function() { $("#tabs a:eq(0),#tabs2 a:eq(0),#dbt_l_t_tabs a:eq(0),#dbt_r_t_tabs a:eq(0)").addClass("m_on"); $("#tabs a:gt(0),#tabs2 a:gt(0),#dbt_l_t

  • jQuery 中$(this).index与$.each的使用指南

    工作当中响应某个需求,切换选项卡的一个效果,根据每个选项下的内容元素的总数不同而进行不同的html变化(如果选项卡下的内容为空就等于XXX,否则就XXX) 复制代码 代码如下: $(function(){          $(".bao").hide();           $(".bao").eq(0).show();           $(".head li").click(function(){               $(thi

  • jquery获取元素索引值index()示例

    jquery获取元素索引值index()方法: jquery的index()方法 搜索匹配的元素,并返回相应元素的索引值,从0开始计数. 如果不给 .index() 方法传递参数,那么返回值就是这个jQuery对象集合中第一个元素相对于其同辈元素的位置. 如果参数是一组DOM元素或者jQuery对象,那么返回值就是传递的元素相对于原先集合的位置. 如果参数是一个选择器,那么返回值就是原先元素相对于选择器匹配元素中的位置.如果找不到匹配的元素,则返回-1. 复制代码 代码如下: <ul> <

  • JQuery使用index方法获取Jquery对象数组下标的方法

    本文实例讲述了JQuery使用index方法获取Jquery对象数组下标的方法.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xh

  • jquery的index方法实现tab效果

    jquery的index方法实现tab效果

    左侧为选项卡,右侧为详细内容. 原理: 点击左侧的列表项,根据所选列表项在列表的[索引n]显示第n个内容. (首先需要将列表和内容一次性加载到页面,内容只显示第一个,这样切换起来更友好.) 如何获取选择列表项在列表中的索引: jquery里有一个方法是index([subject]) $("#ul li").index($("#selected")); 意思是 首先设定列表范围(#ul li列表),然后返回$("#selected")元素在列表中

  • jQuery中index()方法用法实例

    本文实例讲述了jQuery中index()方法用法.分享给大家供大家参考.具体分析如下: 此方法可以搜索匹配元素,并返回元素的索引值. 索引值是从0开始的. 语法结构一: 当此方法没有参数的时候,返回值是指定元素在其同辈元素集合中的索引位置. 复制代码 代码如下: $(selector).index() 实例代码: 实例一: 复制代码 代码如下: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8&quo

  • Jquery index()方法 获取相应元素索引值

    index([subject])方法,返回值:Number(从0开始计数) index()方法返回指定元素相对于其他指定元素的 index 位置.注释:如果未找到元素,index() 将返回 -1. 复制代码 代码如下: <html> <head> <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.4.2/jquery.min.js">&l

  • jQuery中index()的用法分析

    本文实例讲解了jQuery中index()的用法.分享给大家供大家参考之用.具体方法如下: 现在有这样一个问题:如果列表里面有N多的列表项目,我想知道我点击了哪一个应该怎么取呢? 对此,jQuery里面提供了一个index()方法 : index(subject) 该方法搜索与参数表示的对象匹配的元素,并返回相应元素的索引值. 如果找到了匹配的元素,从0开始返回:如果没有找到匹配的元素,返回-1. 但是 API里面提供的例子貌似不对,示例如下: <ul> <li><a hre

  • jQuery中get方法用法分析

    本文实例讲述了jQuery中get方法用法.分享给大家供大家参考,具体如下: 参数:url,[data],[callback],[type] url 待载入页面的URL地址. data 待发送 Key/value 参数. callback 载入成功时回调函数. type 返回内容格式,xml, html, script, json, text, _default. 案例1 表单代码: <form id="form1" action="#"> <p&

  • JQuery中Bind()事件用法分析

    本文实例分析了JQuery中Bind()事件用法.分享给大家供大家参考.具体分析如下: 我们先看一下它的定义: .bind( eventType [, eventData], handler(eventObject)) .Bind()方法的主要功能是在向它绑定的对象上面提供一些事件方法的行为.期中它的三个参数的意义分别如下: eventType是一个字符串类型的事件类型,就是你所需要绑定的事件.这类类型可以包括如下:blur, focus, focusin, focusout, load, re

  • jQuery中slideUp()方法用法分析

    本文实例讲述了jQuery中slideUp()方法用法.分享给大家供大家参考.具体分析如下: 此方法通过高度变化(向上减小)来动态地隐藏所有匹配的元素,并且隐藏完成后还可以地触发一个回调函数. slideUp()方法只调整元素的高度,可以使匹配的元素以"滑动"方式隐藏起来. 一.语法结构: 此方法可以规定动画效果持续时间,如果没有规定时间则使用默认值normal.例如: 复制代码 代码如下: $("div").slideUp(5000) 以上代码可以设置动画效果在5

  • Jquery中CSS选择器用法分析

    Jquery中CSS选择器用法分析

    本文实例讲述了Jquery中CSS选择器用法.分享给大家供大家参考.具体如下: jQuery使用了一套css选择器,共有5种,即标签选择器,ID选择器,类选择器,通用选择器和群组选择器,现分述如下: 1. 标签选择器 用于选择HTML页面中已有的标签元素,又称元素选择器,格式:$("element"),如$("div"),同getElementByTagName 2. ID选择器 用于获取某个具有id属性的元素,格式如下:$("id"),同get

  • jquery中filter方法用法实例分析

    本文实例讲述了jquery中filter方法用法.分享给大家供大家参考.具体分析如下: filter()方法将匹配元素集合缩减为匹配指定选择器的元素. filter方法中的参数可以为字符串值,包含供匹配当前元素集合的选择器表达式.   一.filter的参数类型可分为两种   1.传递选择器 $('a').filter('.external')   2.传递过滤函数 复制代码 代码如下: $('a').filter(function(index) {         return $(this)

  • JQuery中extend的用法实例分析

    本文实例讲述了JQuery中extend的用法.分享给大家供大家参考.具体分析如下: extend()函数是jQuery的基础函数之一,作用是扩展现有的对象.extend是我们在写插件的过程中常用的方法,该方法有一些重载原型.$.extend(prop) 用于扩展jQuery对象,可以用于把函数添加到jQuery名称空间中. 一.jQuery.extend函数的源码 jQuery.extend = jQuery.fn.extend = function() { var options, name

  • jQuery中的siblings用法实例分析

    本文实例讲述了jQuery中的siblings用法.分享给大家供大家参考,具体如下: 所谓siblings,英文翻译就是兄弟节点.那么故名思意,就是拿到某元素的兄弟节点(不包括自己). <html> <head> <script type="text/javascript" src="/jquery/jquery.js"></script> </head> <body> <ul> &

  • JQuery中Text方法用法实例分析

    本文实例讲述了JQuery中Text方法用法.分享给大家供大家参考.具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <hea

随机推荐