每日一句English(start from today):

  In the previous section we just displayed a list of string entered statically in the Python code.(源于odoo的开发文档)。

翻译:在上一节中我们只显示一个列表的字符串输入静态的Python代码。(百度翻译)

    在群里看见有人问了关于,获得当前对象的index值得时候,我做了demo ,获得了当前的index,方法多种,下面我就用我的方法来讲解我的代码:

  模拟数据:div里面5个button

 <div>
<button>1</button>
<button>2</button>
<button>3</button>
<button>4</button>
<button>5</button>
</div>
下面就是关于取这个index的for循环代码:
<script>
var obj = document.getElementsByTagName("button");
for(var i = 0;i < obj.length;i++) {
(function(i){
obj[i].onclick = function(){
console.log(i);
}
})(i);
}
</script>
  对于这个闭包需要讲解一下:可能大多数同学在不理解onclick的时候,就会发现他们获得值就是最后一个值,会写下这么的一串代码
for(var i = 0;i < obj.length;i++) {
obj[i].onclick = function(){
  console.log(i+1);
     }
}

  如图错误:

  

  onclick这个点击函数是异步执行的,也就是说在点击获得值得时候,循环已经结束,到达最后一个值,这时候i的值为5.所以,每次点击的时候,都是获得一样的值。因此,如果想获得里面的i的值的时候就需要将i值包裹起来,就需要用这样的闭包形式,函数自调传入当前的i。每次循环一次,就会让函数自调一次,输出当前的i.索引值是从0开始的,这里加1是想让他输出button的序号。正确所示:

  

  顺便附上关于jq的写法:这里就不用考虑闭包了,都在jq的index这个方法包裹在里,有兴趣的同学可以去找这段jq的源码,来看看这个index的方法是怎么样封装的。

$("button").click(function(){
var index = $("button").index(this);
console.log(index);
})

  具体关于闭包的详细解析:我会在在下篇 【闭包的理解】,详细讲解我对于闭包的理解。

  谢谢浏览!

关于获得当前的index的方法的更多相关文章

  1. IndexOf、LastIndexOf、Substring的用法及C# foreach 中获取索引index的方法

     String.IndexOf String.IndexOf 方法 (Char, Int32, Int32)报告指定字符在此实例中的第一个匹配项的索引.搜索从指定字符位置开始,并检查指定数量的字符位置 ...

  2. thinkPHP隐藏url地址栏中的index.php方法

    http://localhost/workSpace/First/index.php/Home/Index/index隐藏上面url中的index.php方法如下: 第一步.删除apache配置文件( ...

  3. MySQL 创建索引(Create Index)的方法和语法结构及例子

    MySQL 创建索引(Create Index)的方法和语法结构及例子 MySQL 创建索引(Create Index)的方法和语法结构及例子   CREATE INDEX Syntax CREATE ...

  4. PHP Notice: Undefined index:解决方法

    PHP Notice:  Undefined index:解决方法 PHP Notice: Undefined index: 解决方法 <pre> if (empty(swoole_get ...

  5. C# foreach 中获取索引index的方法

    方法一: int i = 0; foreach (var item in arr) { i++; } 方法二: foreach (var item in arr) { int index = arr. ...

  6. (转)C# foreach 中获取索引index的方法

    在C# 开发中往往使用foreach 循环语句 来代替for循环语句.foreach 比 for 更加简洁高效.           foreach :                 foreach ...

  7. C# foreach 中获取索引index的方法[转]

    在C# 开发中往往使用foreach 循环语句 来代替for循环语句.foreach 比 for 更加简洁高效.           foreach :                 foreach ...

  8. ThinkPHP在Apache和Nginx下去除index.php方法

    由于项目需要,用ThinkPHP开发的程序链接要去除index.php下面说下如何解决.一.Nginx方法 由于nginx不支持PATH_INFO,所以需要进入linux终端找到nginx 的配置文件 ...

  9. IIS7以上版本去掉伪静态去掉index.php方法

    1,由于从iis7以上的版本httpd.ini文件已不会被解析,将以下的xml文件复制到web.config 的文件中,然后放到网站的根目录即可. <?xml version="1.0 ...

随机推荐

  1. JavaSe:代码块执行顺序

    //执行顺序:(优先级从高到低.)静态代码块>mian方法>构造代码块>构造方法. 其中静态代码块只执行一次.构造代码块在每次创建对象是都会执行. //普通代码块:在方法或语句中出现 ...

  2. Execution default of goal org.springframework.boot:spring-boot-maven-plugin:1.5.6.RELEASE:repackage failed: Unable to find main class

    异常 [INFO] --- spring-boot-maven-plugin:1.5.6.RELEASE:repackage (default) @ spring-boot-starter-log - ...

  3. 工作随笔——Golang interface 转换成其他类型

    新的公司,新的氛围.一年了,打算写点什么.so,那就写google的golang语言吧. 最最最基础的语法结构见go语言菜鸟教程 接下来写点菜鸟教程没有的. go语言的设计者认为:go语言必须让程序员 ...

  4. fatal: Authentication failed for “someurl”

    一.前言 我们在公司做项目,很多时候会遇到这个问题:Git failed with a fatal error. Authentication failed for ‘ http// xxx..... ...

  5. 《Netty5.0架构剖析和源码解读》【PDF】下载

    <Netty5.0架构剖析和源码解读>[PDF]下载链接: https://u253469.pipipan.com/fs/253469-230062545 内容简介 Netty 是个异步的 ...

  6. 4. sudo,PATH环境变量,修改字符集,ntpserver,加大文件描述符,隐藏内核版本,锁定关键系统文件

    1   命令:  visudo              98gg      98行             yy           复制当前行             p              ...

  7. Django学习(3)模板定制

    在Django学习(一)一首情诗中,views.py中HTML被直接硬编码在代码之中,虽然这样便于解释视图是如何工作的,但直接将HTML硬编码到视图却不算一个好主意.因为: 对页面设计进行的任何改变都 ...

  8. Django的设计模式

    MVC模式 MVC将应用程序分解为三个组成部分:mode(模型).view(视图).control(控制器),其中: M 管理应用程序的状态(通常存储到数据库中),并榆树改变状态的行为(或者叫&quo ...

  9. Huffman 哈夫曼编码与译码的原理剖析及C++实现

    原理 我们在信息存储时,希望以最少的空间去存储最大的数据,方便数据的传输,那么该怎样做呢? 我们想到将源信息转化为01序列存储,但是这样以来又有一个问题,就是子串匹配问题,我们为了解决这个方法,想到了 ...

  10. ES6对象及ES6对象简单拓展

    ES6对象和传统的JS比较起来支持简写,比如说属性简写方法简写,还支持name属性,可以通过他迅速得到函数属性名表达式(如果是用bind方法创造的函数name属性会返回bound加上原函数的名字,Fu ...