作者lily50735 (汶)
看板Web_Design
標題[請益] 有關圖片更換
時間Fri Oct 11 19:50:10 2013
現在在學javascript
這周老師教到math.random、for loop、bubble sort...
在寫作業的時候想要有點變化
打算做預測樂透開獎的程式
我做了49顆銀色的球
想要讓被抽中的色球換色
Google只找到針對單一圖片作變換的函數
將圖片名稱設為pic 新圖路徑設進imgfile[]
function changeImage(){
document.pic.src = imgfile[0]
}
想請問要怎麼寫才能讓亂數抽出的號碼變色呢?
document.pic.src 這中間有辦法插入變數嗎?
苦惱好久了 真的無解嗎?
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 140.119.120.1
1F:推 pm2001:兩種方法 一個是eval 一個是把所有pic存在陣列裡面 10/11 20:36
p大是指把銀球的圖也存在陣列裡嗎?
2F:→ lyforever:可以改變class就可以用css去做了? :p 10/11 21:54
3F:→ danny8376:先問需求... 你有49顆都是銀色的球 然後要變色? 10/11 23:08
恩 本來有49顆銀色的球(s1-s49)
亂數取六個數字 要把這六個數變成紅色的球(r1-r49)
5F:推 aspdoctor:直接改class最快也最好 10/12 01:02
感謝以上大家回應
我目前不太懂改Class的意思
我想我研究一下s大的寫法再上來發問好了
--
所以大家說的利用class 是指
document.getElementsByClassName(); 這個函數嗎?
我好像有點懂了
來試試會不會成功
--
我又遇到了一個問題
因為重新選號時希望色球會先都回復成銀色
再依新選中的號碼變色
所以我寫了
function resetpic(){
var my_pic = document.getElementsByClassName("sball");
for(var i=0;i<49;i++){
my_pic[i-1].src = "pic/s"+i+".png";
}
}
但是debug的時候他說Cannot set property 'src' of undefined
是因為my_pic
[]不能直接放變數嗎?
6F:→ danny8376:為何要 i-1 ? => i=0 => 0-1 = -1 => pic[-1] = 沒東西 10/12 23:32
7F:→ danny8376:看你的寫法&需求 10/12 23:33
8F:→ danny8376:my_pic[i].src = "pic/s"+(i+1)+".png"; 10/12 23:33
9F:→ danny8376:這樣才對吧? 10/12 23:33
對耶! 成功重置圖片了
可是de完一個bug下一隻又跑出來了
重置完圖片我的網頁又掛掉了
能請板眾直接幫我看問題到底出在哪裡嗎?
http://goo.gl/49VfM6 (dropbox連結)
10F:推 hit1205:問題出在你把 49 改成了 50... XD 10/13 03:13
11F:→ hit1205:你要嘛就是像樓上說的用 i 和 i+1 10/13 03:14
12F:→ hit1205:不然就是 var i=1;i<50;i++ 10/13 03:14
13F:→ hit1205:因為有 49 張圖,所以他們在陣列裡的索引會是 0 ~ 48 10/13 03:14
14F:→ hit1205:啊,我上面沒說清楚XD 你已經像樓上說的用i和i+1的話,那就 10/13 03:16
15F:→ hit1205:不用動for。如果要動for,那就是i-1和i不動,上面變i=1;i<50 10/13 03:17
16F:→ hit1205:對了,數字其實可以不寫死,用my_pic.length可以直接取得 10/13 03:19
17F:→ hit1205:陣列的長度 =) 10/13 03:19
哇! 成功了!
原來只是因為for沒設好
感謝大家~~ 看他成功跑出來超開心的 XD
※ 編輯: lily50735 來自: 1.164.208.125 (10/13 07:54)