上面圈出的那句没有执行,因为this.index 是undefined,(也不能直接使用i取代this.index,原因是i不是变化的值,使用alert打印输出的i值始终为3)

解决方式:在for语句执行时给当前lis[i]设置index值;

另一种写法是: 其中将i作为函数参数传入,此时的i是变化的;

例子:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script>
window.onload=function(){
var aBtn = document.getElementsByTagName('input');
for(var i=0;i<aBtn.length;i++){
aBtn[i].index=i;
aBtn[i].onclick=function(){
alert('i:'+i); //结果永远为3
alert('this.index:'+this.index); //结果:0,1,2
};
}
};
</script>
</head>
<body>
<input type="button" value="btn1" />
<input type="button" value="btn2" />
<input type="button" value="btn3" />
</body>
</html>

js中this.index使用的更多相关文章

  1. Handlebars.js循环中索引(@index)使用技巧(访问父级索引)

    使用Handlebars.js过程中,难免会使用循环,比如构造数据表格.而使用循环,又经常会用到索引,也就是获取当前循环到第几次了,一般会以这个为序号显示在页面上. Handlebars.js中获取循 ...

  2. vue中config/index.js:配置的详细理解

    当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面  (环境变量及其基本变量的配置) var path = require('path') ...

  3. 微信小程序首页index.js获取不到app.js中动态设置的globalData的原因以及解决方法

    前段时间开发了一款微信小程序,运行了也几个月了,在index.js中的onLoad生命周期里获取app.js中onLaunch生命周期中在接口里动态设置的globalData一直没有问题,结果昨天就获 ...

  4. 【repost】JS中的异常处理方法分享

    我们在编写js过程中,难免会遇到一些代码错误问题,需要找出来,有些时候怕因为js问题导致用户体验差,这里给出一些解决方法 js容错语句,就是js出错也不提示错误(防止浏览器右下角有个黄色的三角符号,要 ...

  5. 如何在Node.js中合并两个复杂对象

    通常情况下,在Node.js中我们可以通过underscore的extend或者lodash的merge来合并两个对象,但是对于像下面这种复杂的对象,要如何来应对呢? 例如我有以下两个object: ...

  6. Node.js中的Session,不要觉得简单哦。

    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,博客地址为http://www.cnblogs.com/jasonnode/ .学习网站上有对应 ...

  7. JS中也可以使用JSTL和EL标签

    //往上滑是调用分页 function Ajax(currPage, pageSize) { // ajax后台交互String currPage,String pageSize var el, Pl ...

  8. 【巩固】JS中的封闭空间

    封闭空间的主要思想在于: JS中给一个变量外面加小括号,是不改变任何结果的.比如 var show = function(){ //定义一个名字为show的函数 ); }; show(); //调用名 ...

  9. 在js中怎么样选择互斥的相邻元素

    在使用jquery中,我们通常会选择siblings()去选择相邻元素,使用eq()方法去匹配元素,使用index()获取对应元素的索引值,具体jquery代码如下: <style> *{ ...

随机推荐

  1. sh_04_列表排序

    sh_04_列表排序 name_list = ["zhangsan", "lisi", "wangwu", "wangxiaoer ...

  2. ar9331修改flash大小和df、cat /proc/mtd的区别

    首先感谢黄工的指导. 在openwrt固件目录下target/linux/ar71xx/image/Makefile,找到对应的机型,修改为4M,8M,16M,32M. 以oolite机型为例,如图所 ...

  3. Win10上安装Awvs 12原版程序和完美破解补丁详细步骤

    环境: Win10 Awvs12安装包 链接:https://pan.baidu.com/s/1FIwYHIEKfLf4XAyeXfhVnA 提取码:6sa8 复制这段内容后打开百度网盘手机App,操 ...

  4. python语言中多继承中super调用所有父类的方法以及要用到的MRO顺序

    在python多继承中,利用super().父类方法,可以调用所有父类,从而在重写的状态下,再次对所有父类的调用! 例: print("******多继承使用super().__init__ ...

  5. line-height与vertical-align:简单的属性不简单

    学习过CSS肯定对line-height与vertical-align两个属性有印象:line-height用来设置行高,vertical-align用来设置文本垂直方向的对齐方式,两种看似十分简单, ...

  6. 使用asio进行异步下载http

    下面是官方demo, 给人耳目一新的感觉,以前是总是把c++当成有类功能的C,看完这个感觉不用自己造轮子了,还是要跟上时代的步伐 // // async_client.cpp // ~~~~~~~~~ ...

  7. EventChannel 原生向Flutter传递数据

    目的:原生页面主动向Flutter页面传递信息 1 flutter步骤 定义EventChannel static const EventChannel eventChannel = EventCha ...

  8. 使用matlab用优化后的梯度下降法求解达最小值时参数

    matlab可以用 -Conjugate gradient -BFGS -L-BFGS 等优化后的梯度方法来求解优化问题.当feature过多时,最小二乘计算复杂度过高(O(n**3)),此时 这一些 ...

  9. idea 编译 brooklin

    gradle 项目导入 idea 之后,各种报错,run 不起来 手动加入各种依赖 配置启动类 指定 log4j.properties

  10. Python中转换角度为弧度的radians()方法

    Python中转换角度为弧度的radians()方法 这篇文章主要介绍了Python中转换角度为弧度的radians()方法,是Python入门中的基础知识,需要的朋友可以参考下 radians()方 ...