关于 for 循环和 onclick() 事件中循环变量的问题

在一个学习案例中，使用以下代码为三个.box元素添加点击事件：

var boxs = document.getelementsbyclassname('box');

for (var i = 0; i < boxs.length; i++) {
    boxs[i].onclick = function () {  // i = 1,2,3
        console.log(i); // i = 3
    }
}