<html>
<head>
<title></title>
<script type="text/javascript" src="
</head>
<body>
<script type="text/javascript">
$(document)ready(function () {
var array = [ ];
//
/*
for(var index in array) {
$("#btn" + index)click(function() {
var item = array[index];
alert(item);
});
}*/
// 始终弹出 因为function() {} 并没有被立即解析直到调用的时候才被解析这时index已经是了
//
/*
for(var index in array) {
$("#btn" + index)click(function(i) {
var item = array[i];
alert(item);
}(index));
}*/
// 立即弹出 因为使用了function() {}(index)立即被解析遇到alert就立即弹出来了
//
/*for (var index in array) {
$("#btn" + index)click(function (i) {
return function () {
var item = array[i];
alert(item);
};
} (index));
}*/
// 正确执行点击btn弹出点击btn弹出
// 因为function(i) {}(index)是被立即解析的所以i依次送入的是
// 内部没有直接alert是因为不想立即执行想点击时再执行所以返回了一个函数出去
//
for (var index in array) {
$("#btn" + index)bind("click" {index: index} clickHandler);
}
function clickHandler(event) {
var index = eventdataindex;
var item = array[index];
alert(item);
}
// 正确执行点击btn弹出点击btn弹出
// 利用了eventdata因为index在绑定的时候已经被持久化到eventdata中了所以响应的时候我们可以取到
});
</script>
<input type="button" id="btn" value="btn" />
<input type="button" id="btn" value="btn" />
<input type="button" id="btn" value="btn" />
<input type="button" id="btn" value="btn" />
</body>
</html>