Как вставить в аргумент функции текущее значение переменной?
Есть пример:
for(var i = 0, h; i < 3; i++)
{
h = document.createElement("button");
h.innerHTML = "alert = " + i;
h.onclick = function(){ alert(i); };
document.body.appendChild(h);
}
Надо чтобы по клику кнопки в сообщении выдавалось значение переменной "i" на момент назначения обработчика клика (0, 1, 2), но все кнопки, естественно, выдают конечное значение "i", равное "3". Как решить такую задачу? |
Лучше функцию вынести отдельно, чтобы не создавать каждый раз новую.
var onClick = function(i) {
alert(i);
};
for(var i = 0, h; i < 3; i++)
{
h = document.createElement("button");
h.innerHTML = "alert = " + i;
h.onclick = onClick.bind(h, i);
document.body.appendChild(h);
}
|
Цитата:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<!--
<script src='https://code.jquery.com/jquery-latest.js'></script>
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
</script>
</head>
<body>
<script type='text/javascript'>
for(var i = 0, h; i < 3; i++){
h = document.createElement("button");
h.innerHTML = "alert = " + i;
h.onclick = (function (N){
return function(){ alert(N); };
})(i)
document.body.appendChild(h);
};
</script>
</body>
</html>
|
Цитата:
Про "bind" ничего не знал. Спасибо! |
Цитата:
|
Цитата:
|
polinin,
Делегирование событий |
Цитата:
|
| Часовой пояс GMT +3, время: 22:05. |