powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Javascript: Передача параметров в функцию
13 сообщений из 13, страница 1 из 1
Javascript: Передача параметров в функцию
    #36551546
H.A.M.
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Есть такая проблема, вот упрощенный пример:

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
function OnItemClicked(i)
{
  alert('You clicked item #' + i);
}

var items = [ ... ];

for(var i =  0 ; i < items.length; i++)
{
  items[i].onclick = function() { OnItemClicked(i); };
}

Алерт все время выводит последнее значение i. Я плохо знаю javascript, как можно сделать это правильно?

Пад'ехалi, лазер уключылi, i кабздец!
...
Рейтинг: 0 / 0
Javascript: Передача параметров в функцию
    #36551552
Фотография Яростный Меч
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
function OnItemClicked(e)
{
  e = e||window.event;
  alert('You clicked item #' + (e.target||e.srcElement).i_value);
}

var items = [ ... ];

for(var i =  0 ; i < items.length; i++)
{
  items[i].i_value = i;
  items[i].onclick = OnItemClicked;
}
...
Рейтинг: 0 / 0
Javascript: Передача параметров в функцию
    #36551573
H.A.M.
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Спасибо!

Пад'ехалi, лазер уключылi, i кабздец!
...
Рейтинг: 0 / 0
Javascript: Передача параметров в функцию
    #36553285
ZeusTheTrueGod
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
H.A.M.,

Вы попались на closure, то есть на незнании внутреннего устройства javascript

У вас в функции переменная i захватывалась каждым обработчиком события. Поэтому то и произошла такая штука - все кнопки ссылаись на одну и ту же переменную цикла, которая в конце равна items.length
...
Рейтинг: 0 / 0
Javascript: Передача параметров в функцию
    #36553820
IDVsbruck
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Угу. Вот понятная конструкция:
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
function OnItemClicked(i) {
    alert('You clicked item #' + i);
}
var items = [ ... ];
for(var i =  0 ; i < items.length; i++) {
    items[i].onclick = function(i) {
        var inner_i = i;
        OnItemClicked(inner_i);
    };
}
...
Рейтинг: 0 / 0
Javascript: Передача параметров в функцию
    #36553860
Фотография Яростный Меч
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
IDVsbruck,

Код: plaintext
var inner_i = i;

вот здесь i - это будет параметр функции-замыкания или переменная из цикла?
...
Рейтинг: 0 / 0
Javascript: Передача параметров в функцию
    #36553877
IDVsbruck
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Конечно, функции. Внутри функции переменная цикла не видна ...
...
Рейтинг: 0 / 0
Javascript: Передача параметров в функцию
    #36553884
Фотография Яростный Меч
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
IDVsbruckКонечно, функции. Внутри функции переменная цикла не видна ...Тогда это будет объект события (в случае Gecko) или нулл (в случае поделки)
...
Рейтинг: 0 / 0
Javascript: Передача параметров в функцию
    #36554307
Фотография illion
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Яростный МечТогда это будет объект события
однозначно. Уже само onclick = function(i) говорит, что i будет мышекликом. А уберем (i) - получим извечное items.length. Сама тоже не люблю эти навороченные обертки с return'ами функций от текущих значений i, но все равно использую их, а не дополнительные атрибуты типа items[i].i_value. Кстати, в твоем примере по идее было бы достаточно alert('You clicked item #' + this.i_value) вместо e = e||window.event и т.д.
...
Рейтинг: 0 / 0
Javascript: Передача параметров в функцию
    #36554310
IDVsbruck
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Блин, действительно лопухнулся ... не каждый день делаю, поторопился ...
...
Рейтинг: 0 / 0
Javascript: Передача параметров в функцию
    #36554330
an0nym
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
illionКстати, в твоем примере по идее было бы достаточно alert('You clicked item #' + this.i_value) вместо e = e||window.event и т.д.
Это workaround для какой-то версии IE, если не ошибаюсь.
...
Рейтинг: 0 / 0
Javascript: Передача параметров в функцию
    #36554337
Фотография illion
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
an0nym,

this вроде даже в ИЕ еще не отменяли :-). Но на шестом проверить не мешает.
...
Рейтинг: 0 / 0
Javascript: Передача параметров в функцию
    #36554376
an0nym
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
illion,

The value of this within the handler
It is often desirable to reference the element from which the event handler was fired, such as when using a generic handler for a series of similar elements. When attaching a function using addEventListener() the value of this is changed—note that the value of this is passed to a function from the caller.

In the example above, the value of this within modifyText() when called from the click event is a reference to the table 't'. This is in contrast to the behavior that occurs if the handler is added in the HTML source:

view plainprint?
<table id="t" onclick="modifyText();">
. . .
The value of this within modifyText() when called from the onclick event will be a reference to the global (window) object.

Internet Explorer
In IE you have to use attachEvent rather than the standard addEventListener. To support IE, the example above can be modified to:

view plainprint?
if (el.addEventListener){
el.addEventListener('click', modifyText, false);
} else if (el.attachEvent){
el.attachEvent('onclick', modifyText);
}
There is a drawback to attachEvent, the value of this will be a reference to the window object instead of the element on which it was fired.
...
Рейтинг: 0 / 0
13 сообщений из 13, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Javascript: Передача параметров в функцию
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]