Я пытаюсь использовать индекс массива, чтобы набор идентификаторов div мог изменяться с одного идентификатора на другой, когда запускаются функции mouseenter и mouseleave.
Я знаю, что есть и другие способы сделать это — переключение, наведение или наведение с помощью CSS. Это просто обучение для меня, и я очень новичок.
Приведенный ниже код прокомментирован, и основная проблема связана с тем, почему переменная массива «largeID» (или smallID) выводит правильные значения, а попытка использовать значение индекса — нет. Для каждого оператора for я хочу, чтобы значение smallID[i] заменялось значением largeID[i], когда мышь входит в div, но я не хочу писать код для каждого, то есть «largeID[1] , большойID[2].
Спасибо за любые указатели!!
$(document).ready(function() {
var smallID = [];
var largeID = [];
var divList = document.getElementsByTagName('div')[1]; //get the second (radialMenu) div in the document
var radialDivList = divList.getElementsByTagName('div'); // get all divs under the second (radialMenu) div
for(var i = 0; i < radialDivList.length; i++) {
if (!radialDivList[i]) continue; //skip null, undefined and non-existent elements
if (!radialDivList.hasOwnProperty(i)) continue; //skip inherited properties
smallID[i] = radialDivList[i].id; //assign the list of four divs to the smallID array;
largeID[i] = smallID[i] + 'Full'; // add "Full" to each smallID element to make a largeID element
alert(smallID[i]); // alerts for smallID / largeID and smallID[i] / largeID[i]
alert(largeID[i]); // give rational and expected output
$('#' + smallID[i]).mouseenter(function () { //works for all four radial menu divs when mouse enters
//BUT largeID[i] is undefined
alert(largeID[i]); // undefined
alert(largeID); // gives expected output of full array
}).mouseleave(function () { //mouseleave function not working
});
}