JavaScript回调方法中使用外部变量出现的问题

测试用例

function cprint(str) {
console.log(str);
}

function temp() {
for(var i=0; i<3; i++) {
$("#bt"+i).click(function() {
cprint(i);
});
}
}

上边方法的目的是给三个bt绑定点击事件，预期的结果是

bt0 click: 0
bt1 click: 1
bt2 click: 2

但是执行后的结果是，点击三个按钮输出的都是3。

bt被点击后回调绑定的click中的方法，回调方法直接使用了外部变量i，而不是自己设置临时变量保存i的结果。

解决办法

function temp() {
for(var i=0; i<3; i++) {
click(i);
}
}

function click(i) {
$("#bt"+i).click(function() {
cprint(i);
});
}