Я продолжаю получать сообщение об ошибке links[i] is undefined.
Я определил это явно, и все же он продолжает давать мне эту ошибку - есть идеи?

Я пытаюсь сделать ненавязчивые ролловеры изображений по 5 ссылкам, которые у меня есть.

function loadImages(){
    path = 'uploads/Splash-4/nav/'; 
    links = new Array();

    for (i=1;i<=5;i++){
        var id = "link-"+i;
        var defaultState = '<img src="' +path+i+'.jpg" border="0" />';
        links[i] = document.getElementById(id);

        // Place all image linksinto anchor
        links[i].innerHTML = defaultState;

        // What to do on mouseover
        links[i].onmouseover = function() { 
            links[i].innerHTML = '<img src="' +path+i+'a.jpg" border="0" />';
        }
        // What to do on mouse oUt
        links[i].onmouseout = function() {
            links[i].innerHTML = defaultState;
        }
    }
}
window.onload = loadImages;

HTML :

 <a href="?page=Profile" id="link-1"></a>
 <a href="?page=for-sale" id="link-2"></a><br />
 <a href="?page=testimonials" id="link-3"></a><br />
 <a href="?page=free-home-appraisal" id="link-4" /></a><br />
 <a href="?page=contact-me" id="link-5"></a><br />
1
Andre 30 Авг 2010 в 18:27

3 ответа

Лучший ответ

Проблема в том, что когда вызывается ваша onmouseover() функция, ваша переменная i = 6, потому что ваша последняя итерация дала i = 6, заставляет цикл заканчиваться. Следовательно, вы должны где-нибудь защитить i. Например :

function loadImages(){
    path = 'uploads/Splash-4/nav/'; 
    var links = [];

    for (i=1;i<=5;i++){
        (function(j) {
            var id = "link-"+j;
            var defaultState = '<img src="' +path+j+'.jpg" border="0" />';
            links[j] = document.getElementById(id);

            // Place all image linksinto anchor
            links[j].innerHTML = defaultState;

            // What to do on mouseover
            links[j].onmouseover = function() { 
                links[j].innerHTML = '<img src="' +path+j+'a.jpg" border="0" />';
            }
            // What to do on mouse oUt
            links[j].onmouseout = function() {
                links[j].innerHTML = defaultState;
            }
        })(i);  // call the anonymous function with i, thus protecting it's value for
                // the mouseover/mouseout

    }
}
2
Yanick Rochon 30 Авг 2010 в 14:36

Ваш фрагмент кода не включает в себя объявление переменных ссылок. Если вы не определили его где-либо еще (то есть, если это локальная переменная), вам нужно сделать это здесь:

Вместо того

links = new Array();

Ты мог бы сделать

var links = new Array();

Один пример можно найти здесь.

Если вы объявили это в другом месте, возможно, эта строка

document.getElementById(id);

Возвращается ноль.

0
Andy 30 Авг 2010 в 14:35

Прежде всего, вы должны сказать:

var links = [];

Как правило, не рекомендуется использовать сам конструктор Array, и, не указав var, вы заставляете переменную links находиться в глобальном пространстве, что, как правило, плохо.

Теперь о вашей актуальной проблеме.

Ваши обработчики событий несут ссылку на переменные path и i из внешней области видимости, но к тому времени, когда они действительно встречаются, переменная i имеет значение {{X3} } - не то, что вы хотели! Чтобы это исправить, вы можете изменить:

    // What to do on mouseover
    links[i].onmouseover = function() { 
        links[i].innerHTML = '<img src="' +path+i+'a.jpg" border="0" />';
    }
    // What to do on mouse oUt
    links[i].onmouseout = function() {
        links[i].innerHTML = defaultState;
    }

К

    // What to do on mouseover
    links[i].onmouseover = (function(path, i) {
        return function () {
            links[i].innerHTML = '<img src="' +path+i+'a.jpg" border="0" />';
        };
    })(path, i);
    // What to do on mouseout
    links[i].onmouseout = (function(i) {
        return function () {
            links[i].innerHTML = defaultState;
        }
    })(i);

Это создает новое закрытие для хранения переменных, которые вы хотите захватить. Таким образом, внутренний i все еще может быть, о, 3, а внешний i равен 6.

6
Anthony Mills 30 Авг 2010 в 14:37