Re: [問題] 不換頁更新圖片資訊

看板Ajax作者 (o(.```.)o)時間15年前 (2009/12/29 23:46), 編輯推噓1(105)
留言6則, 4人參與, 最新討論串2/6 (看更多)
※ 引述《chocho1981 (o(.```.)o)》之銘言: : 我想請問一下這樣的效果要怎麼做 : 我目前有一個網頁 裡面有一張小圖片 旁邊一個按鈕 : 目前的情況是 : 按鈕按下==> ASP網頁 ==> 資料庫 ==> ASP網頁 ==> 圖片效果 : (更改圖片 (存入資料庫) (讀取圖片 (顯示圖片) : X、Y座標) 新的座標) 新的座標) : : 我這網頁是一個類似大富翁的遊戲 : 但是每次按下按鈕 整個網頁就要重新讀取一次 : 有沒有辦法使用AJAX : 讓按鈕按下後 只更新圖片的座標就好 (同時要修改資料庫的值) 不好意思 再請教一個問題 我目前是已經可以成功的做出我之前想要的程序了 只是又有個問題 當初我在做那個大富翁遊戲時 按下按鈕後 會紀錄下先前的座標 和之後的座標 然後用 javascript 做出一個移動的效果 當初是這樣弄的 <1> <body onLoad="process()"> <2> <SCRIPT LANGUAGE="JavaScript"> function process() { setInterval("showTimer();",10); } var i=0; function showTimer() { if (<%=rs5("locX")-session("locX")%>>=i){ document.getElementById('move_pic').style.left=<%=session("locX")%>+i i+=2; } if (<%=rs5("locY")-session("locY")%>>=i){ document.getElementById('move_pic').style.top=<%=session("locY")%>+i; i+=2; } if (<%=rs5("locX")-session("locX")%><=i*-1){ document.getElementById('move_pic').style.left=<%=session("locX")%>-i; i+=2; } if (<%=rs5("locY")-session("locY")%><=i*-1){ document.getElementById('move_pic').style.top=<%=session("locY")%>-i; i+=2; } ============================================================================== 節錄程式碼如上 原本是可以作用的 但是使用ajax的方法讀取這樣的程式碼 卻發現一點效果也沒有 我自己是在猜想是不是用了ajax讀取 所以 <body onLoad="process()"> 這段變成無效了? 請教一下是因為這樣嗎? 還是有可能是其他我沒發現的問題? 如果真是這樣的話 可以有什麼解決方式呢? -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 210.240.131.71

12/29 23:53, , 1F
你怎麼讀取 , 讀取了什麼 這兩點要說啊...
12/29 23:53, 1F
<script language=javascript> <!-- function httpget(xUrl, method, sendData) { var xmlhttp=false; try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (E) { xmlhttp = false; } } if (!xmlhttp && typeof XMLHttpRequest!='undefined') { try { xmlhttp = new XMLHttpRequest(); } catch (e) { xmlhttp=false; } } if (!xmlhttp && window.createRequest) { try { xmlhttp = window.createRequest(); } catch (e) { xmlhttp=false; } } method = method.toUpperCase(); if(method!="POST" && method!="GET") return ""; xmlhttp.open(method, xUrl, false); if(method=="POST") xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); xmlhttp.send(sendData); return xmlhttp.responseText; } function getContent(objname, cid) { var obj = document.getElementById(objname); if(obj) { obj.innerHTML = httpget("chk.asp", "GET", ""); } } function postContent(objname, postdata) { var obj = document.getElementById(objname); if(obj) { obj.innerHTML = httpget("chk.asp", "POST", postdata); } } --> </script> 程式碼主要如上列所示 再配上一個按鈕 和一個DIV標籤 <input type="button" value"GO" name="B3" onclick="postContent('div1','B3=1');"> <div id=div1> </div> 按鈕按下後去將資料送到chk.asp去作處理 更新資料庫後 一樣由chk.asp這個網頁秀出資料庫中更新過後的數據 大致上是這樣~"~ ※ 編輯: chocho1981 來自: 210.240.131.69 (12/30 00:08)

12/30 00:04, , 2F
用ajax沒有reload的話 body onload就只會執行一次
12/30 00:04, 2F

12/30 00:27, , 3F
所以使用ajax就沒辦法用JS做動畫效果了嗎 QQ?
12/30 00:27, 3F

12/30 02:39, , 4F
當然不是啊 你要找其他觸發點 或用setTimeout之類的
12/30 02:39, 4F

12/30 09:25, , 5F
showTimer中的變數應該由JavaScript去給定,才能配合AJAX使
12/30 09:25, 5F

12/30 09:26, , 6F
用,然後在AJAX request結束後去呼叫process就行了
12/30 09:26, 6F
文章代碼(AID): #1BEYHRSI (Ajax)
文章代碼(AID): #1BEYHRSI (Ajax)