อยากถามเกี่ยวกับการใช้ loop for ในการ select id ของjQuery ครับ
Code (jQuery index.html)
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript" src="script.js">
$(document).ready(function(){
test();
});
</script>
Code (jQuery script.js)
function test(){
$("#bm0").bind('mouseover',function(){
$("#bm0").addClass('icon');
$("#bm0").attr("src","images/menu/side/cm0.png");
});
$("#bm0").bind('mouseout',function(){
$("#bm0").attr("src","images/menu/side/m0.png");
});
$("#bm1").bind('mouseover',function(){
$("#bm1").addClass('icon');
$("#bm1").attr("src","images/menu/side/cm1.png");
});
$("#bm1").bind('mouseout',function(){
$("#bm1").attr("src","images/menu/side/m1.png");
});
$("#bm2").bind('mouseover',function(){
$("#bm2").addClass('icon');
$("#bm2").attr("src","images/menu/side/cm2.png");
});
$("#bm2").bind('mouseout',function(){
$("#bm2").attr("src","images/menu/side/m2.png");
});
$("#bm3").bind('mouseover',function(){
$("#bm3").addClass('icon');
$("#bm3").attr("src","images/menu/side/cm3.png");
});
$("#bm3").bind('mouseout',function(){
$("#bm3").attr("src","images/menu/side/m3.png");
});
$("#bm4").bind('mouseover',function(){
$("#bm4").addClass('icon');
$("#bm4").attr("src","images/menu/side/cm4.png");
});
$("#bm4").bind('mouseout',function(){
$("#bm4").attr("src","images/menu/side/m4.png");
});
$("#bm5").bind('mouseover',function(){
$("#bm5").addClass('icon');
$("#bm5").attr("src","images/menu/side/cm5.png");
});
$("#bm5").bind('mouseout',function(){
$("#bm5").attr("src","images/menu/side/m5.png");
});
}
แบบนี้สามารถใช้ loop เพื่อ เปลี่ยน selector ได้อย่างไรครับ
ลองแบบนี้แล้วไม่ได้ครับ
Code (jQuery)
for(i=0;i<6;++i){
$("#bm"+i).bind('mouseover',function(){
$("#bm"+i).addClass('icon');
$("#bm"+i).attr("src","images/menu/side/cm"+i+".png");
});
$("#bm"+i).bind('mouseout',function(){
$("#bm"+i).attr("src","images/menu/side/m"+i+".png");
});
}
Tag : - - - -
Date :
2010-05-31 17:57:30
By :
spnut
View :
1008
Reply :
4
ไม่น่าจะมีปัญหาครับ ลองดูดีๆ
ใส่ใน $(ducument).ready() ยังคับ
Date :
2010-05-31 19:52:54
By :
pjgunner
ไม่ได้ครับลองแล้ว
Date :
2010-05-31 22:26:59
By :
spnut
เขียนแบบนี้แทนครับ
Code (JQUERY) ขอคะแนนให้ผมด้วยนะค้าบบบ
$(document).ready(test);
function test(){
$("img[id^=bm]").bind('mouseover',function(){
var id = $(this).attr('id').replace('bm','');
$(this).addClass('icon');
$(this).attr("src","images/menu/side/cm"+id+".png");
}).bind('mouseout',function(){
var id = $(this).attr('id').replace('bm','');
$(this).attr("src","images/menu/side/m"+id+".png");
});
}
ปล. นี่โค้ดของคุณตรงที่ผม highlight ไว้ ไม่ต้องใส่นะครับ
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript" src="script.js" >
$(document).ready(function(){
test();
});
</script>
Date :
2010-05-31 23:11:03
By :
kerb
<script>
$(function(){
$("#bm1,#bm2,#bm3,#bm4,#bm5,#bm6").each(function(){
$(this).bind('mouseover',function(){
var i = $(this).attr('id').replace(/bm/,'');
$(this).addClass('icon');
$(this).attr("src","images/menu/side/cm"+i+".png");
});
$(this).bind('mouseout',function(){
var i = $(this).attr('id').replace(/bm/,'');
$(this).attr("src","images/menu/side/m"+i+".png");
});
});
});
</script>
Date :
2010-05-31 23:14:20
By :
num
Load balance : Server 00