Форумы портала PHP.SU :: Версия для печати :: Как глобальные переменные передать функции-обработчику события в jquery

1. surrealistic pillow - 06 Мая, 2015 - 10:25:15 - перейти к сообщению

Задача стоит такая - есть четыре ссылки, внутри которых изображения.
Нужно сделать, чтобы при наведении мыши на ссылку атрибут src изображения менялся (указывал на другое изображение, с префиксом '-hover' в имени)

Вопрос в следующем - как глобальные переменные передать функции-обработчику события в jquery

CODE (html):
скопировать код в буфер обмена

<div class='tm-nite-icons' style='margin:auto;width:300px;'>
        <a class='white0' href='#'><img src='00.png'></a><br>
        <a class='white1' href='#'><img src='01.png'></a><br>
        <a class='white2' href='#'><img src='02.png'></a><br>
        <a class='white3' href='#'><img src='03.png'></a><br>
</div>

CODE (javascript):
скопировать код в буфер обмена

jQuery(document).ready(function(){              
                arr = new Array('00','01','02','03');// имена файлов-картинок без расширения
                for(var i = 0; i<=3; i++){                      
                        var a = '.white' + (i);//здесь хранится css класс ссылки
                        var image = a + ' img';//изображение, которому будем менять атрибут src                         
                        //alert (a); //работает, выводит переменную
                        jQuery(a).hover(function(arr, i, image){
                                var path = '/images/' + arr[i] + '-hover.png';//при наведении мыши на ссылку, путь ведет к изображению с префиксом hover
                                //alert(path); //не работает, значение глобальной переменной arr[i] определяется как undefined
                                jQuery(image).attr('src', path);
                        },
                        function(arr, i, image){
                                var path = '/images/' + arr[i] + '.png';//если мышь не наведена на ссылку, путь ведет к изображению без префикса hover
                                jQuery(image).attr('src', path);
                        });
                }
        });