我需要知道点击元素的索引.无法弄清楚如何做到这一点
for (i = 0; i < document.getElementById('my_div').children.length; i++) {
document.getElementById('my_div').children[i].onclick = function(){'ALERT POSITION OF CLICKED CHILD'};
}
this.index？
这里是我想要做的一个例子(它只给了6)：
<!DOCTYPE html> <html> <head> <Meta charset="utf-8" /> <title>Untitled Document</title> <style type="text/css"> body{margin:0;} #container div{height:50px;line-height:50px; text-align:center} </style> </head> <body> <div id="container"> <div>1</div> <div>2</div> <div>3</div> <div>4</div> <div>5</div> <div>6</div> </div> <script> for (i = 0; i < document.getElementById('container').children.length; i++) { document.getElementById('container').children[i].onclick = function(){alert('Number ' + i + ' was clicked')}; } </script> </body> </html>
解决方法
这是一个
piece of code,可以帮助您获得for循环中点击的元素的索引.所有你需要的是一个新的
scope：
var g = document.getElementById('my_div');
for (var i = 0,len = g.children.length; i < len; i++)
{
(function(index){
g.children[i].onclick = function(){
alert(index) ;
}
})(i);
}
event handler already is a closure
