作者chocho1981 (o(.```.)o)
看板Ajax
标题Re: [问题] 不换页更新图片资讯
时间Tue Dec 29 23:46:32 2009
※ 引述《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
1F:→ TonyQ:你怎麽读取 , 读取了什麽 这两点要说啊... 12/29 23:53
<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)
2F:→ emn178:用ajax没有reload的话 body onload就只会执行一次 12/30 00:04
3F:→ chocho1981:所以使用ajax就没办法用JS做动画效果了吗 QQ? 12/30 00:27
4F:推 buganini:当然不是啊 你要找其他触发点 或用setTimeout之类的 12/30 02:39
5F:→ emn178:showTimer中的变数应该由JavaScript去给定,才能配合AJAX使 12/30 09:25
6F:→ emn178:用,然後在AJAX request结束後去呼叫process就行了 12/30 09:26