[問題] .hover 與迴圈?
最近用jQuery1.10，希望設計成滑鼠滑過相應的主選單，子選單就會展開
五個主選單id: MENU1 ~ MENU5
五個子選單id: SUB1 ~ SUB5
原本寫成:
$("#MENU1").hover(
function(){
$("#SUB1").slideDown(800);
},function(){
$("#SUB1").slideUp(300);
});
.
.
.
.
$("#MENU5").hover(
function(){
$("#SUB5").slideDown(800);
},function(){
$("#SUB5").slideUp(300);
});
為了希望精簡而改成迴圈，卻發現下面這個方法不行
for(var i = 1; i < 6; i++){
$("#MENU"+i).hover(
function(){
alert(i);
$("#SUB"+i).slideDown(800);
},function(){
$("#SUB"+i).slideUp(300);
});
}
我後來以查到可行的寫法(內部兩個function "#SUB"+變數 要改用 this.id.substr(4)
控制)，但仍想請教:
1. 為何明明同樣包在迴圈之內，內部兩個function用 i 卻無法正確執行?
其原理為何?
2. 在內部function 增設一alert(i)觀察，卻發現其 i 值是"6"!
甚至超過迴圈的上限，這又是為何?
有勞各位先進了，謝謝 m(_ _)m
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 114.42.210.109
※ 文章網址: http://www.ptt.cc/bbs/Web_Design/M.1398141344.A.B81.html
→
04/22 12:53, , 1F
04/22 12:53, 1F
→
04/22 12:55, , 2F
04/22 12:55, 2F
→
04/22 12:59, , 3F
04/22 12:59, 3F
→
04/22 15:06, , 4F
04/22 15:06, 4F
→
04/22 19:31, , 5F
04/22 19:31, 5F
→
04/22 19:32, , 6F
04/22 19:32, 6F
→
04/22 19:35, , 7F
04/22 19:35, 7F
→
04/22 19:37, , 8F
04/22 19:37, 8F
推
04/22 19:42, , 9F
04/22 19:42, 9F
→
04/22 23:01, , 10F
04/22 23:01, 10F
→
04/22 23:02, , 11F
04/22 23:02, 11F
→
04/22 23:07, , 12F
04/22 23:07, 12F
→
04/22 23:09, , 13F
04/22 23:09, 13F
→
04/22 23:26, , 14F
04/22 23:26, 14F
→
04/22 23:26, , 15F
04/22 23:26, 15F