AJAX-prototype.js实现Ajax

来源:互联网 发布:淘宝5元优惠券图片 编辑:程序博客网 时间:2024/05/17 07:32

代码分两部分
1.用一个简单服务器脚本rand.php模拟不断变化的股票价格:

<?phpsrand((double)microtime()*1000000);$price = 50+rand(0,5000)/100;echo "$price";?>

2.新建一个prototype-test.html文件,

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Stock</title>    <script src="prototype.js"></script>    <script>        function checkprice() {            var myAjax = new Ajax.PeriodicalUpdater('price','rand.php',{method:'post',frequency:3.0,decay:1});        }        window.onload = checkprice;    </script></head><body><h2>Stock Reader</h2><p>Current Stock Price:</p><div id="price"></div></body></html>

这个界面很简单,一个标题一行文字,还有显示股票价格的div,
图中红圈位置的数据会随时变化.

这里写图片描述

prototype.js的一些类封装的代码可以发送服务器请求,监视请求的过程,处理返回的数据.
Ajax.Request
var myAjax = new Ajax.Request(url,{method:’post’,parameters:mydata,onComplete:responseFunction});
Ajax.Updater
var myAjax = new Ajax.Updater(elementID,url,options);
Ajax.PeriodicalUpdater
var myAjax = new Ajax.PeriodicalUpdater(‘id’,’url’,{method:’post’,frequency:3.0,decay:1});
这个是本案例使用的,比Ajax.Updater多了两个参数frequency,decay

原创粉丝点击