[ js ] 按鈕後逐行顯示文字的效果

看板Ajax作者 (TYBS)時間14年前 (2011/12/22 15:28), 編輯推噓0(0021)
留言21則, 2人參與, 最新討論串1/1
各位前輩好 我想要做一個效果 按下按鈕或連結後,文字會相隔秒數逐行顯示出來 我有找到一個類似的範例,但他是開啟網頁就自動顯示(body onload) 不知有沒有類似效果,或者可以怎麼修改此範例 來達到我的需求 範例: ==================================================== <script language="javascript"> <!-- text = new Array("第一行","第二行","第三行"); i = 0; str = ""; function type(){ str += text[i] + "<br>"; txt.innerHTML = str; i++; if (i>=text.length)i=0; setTimeout("type()",300); } //--> </script> <body onload="type()"> <div id="txt"></div> =================================================== 謝謝 -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 60.251.120.158 ※ 編輯: TYBS 來自: 60.251.120.158 (12/22 15:28)

12/22 15:29, , 1F
你把body的onload拿掉,把type() 放到button的onclick去就
12/22 15:29, 1F

12/22 15:29, , 2F
好了。當作最基本的js練習...
12/22 15:29, 2F

12/22 15:31, , 3F
有這樣試過,但不行耶 <a href="#" onclick="type()">A</a>
12/22 15:31, 3F

12/22 15:32, , 4F
你的code只有第一次跑會動喔,第二次跑隻後會因為i已經太大
12/22 15:32, 4F

12/22 15:33, , 5F
了,就不會繼續顯示了。你要先確定這是你想要的行為
12/22 15:33, 5F

12/22 15:33, , 6F
不然你就再onclick時把i歸零再跑跑看
12/22 15:33, 6F

12/22 15:33, , 7F
anyway 沒sample沒真相
12/22 15:33, 7F

12/22 15:35, , 8F
12/22 15:35, 8F

12/22 15:36, , 9F
我說你改過不會動的完整codey
12/22 15:36, 9F

12/22 15:36, , 10F
貼上來看看
12/22 15:36, 10F

12/22 15:37, , 11F
就是如你說的 把onload拿掉 加一個button裡onclick
12/22 15:37, 11F

12/22 15:40, , 12F
試過 <button onclick="type()"></button>
12/22 15:40, 12F

12/22 15:40, , 13F
<input type="button" onclick="type()"></input>
12/22 15:40, 13F

12/22 15:41, , 14F
<a href="#" onclick="type()"></a> 都出現物件不支援此動作
12/22 15:41, 14F

12/22 15:42, , 15F
當然解決按鈕問題後,還要加上讓文字停止的語法....=.=
12/22 15:42, 15F

12/22 15:44, , 16F

12/22 15:45, , 17F
這個sample 問題太多了 , txt 是用ieonly的寫法,
12/22 15:45, 17F

12/22 15:45, , 18F
變數沒有定義,最麻煩的是 type() 似乎踢到關鍵字雷。XD
12/22 15:45, 18F

12/22 15:45, , 19F
至於怎麼停下,只要修改一行就可以了
12/22 15:45, 19F

12/22 15:46, , 20F
xhttp://jsfiddle.net/3z3A5/1/
12/22 15:46, 20F

12/22 15:52, , 21F
哇 非常感謝,謝TonyQ, m(_ _)m
12/22 15:52, 21F
文章代碼(AID): #1Eyjm1MZ (Ajax)
文章代碼(AID): #1Eyjm1MZ (Ajax)