index.html文件
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JQuery之股票信息</title>
<link href="css/Stock.css" rel="stylesheet" type="text/css" />
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/Stock.js" type="text/javascript"></script>
</head>
<body>
<div id="300001"><a href="#">上证指数：</a><span></span></div>
<div id="000001"><a href="#">浦发银行：</a><span></span></div>
<div id="stock">
<div id="yes">昨天：<span></span></div>
<div id="tod">今天：<span></span></div>
<div id="now">当前：<span></span></div>
</div>
</body>
</html>Stock.js文件
//保存服务器端返回的股票对象
var obj;
var divId;
$(function(){
var stockNode=$("#stock");
stockNode.css("border","1px solid black").css("background-color","#eee").width("200px")
.css("position","absolute").css("z-index","50");
stockNode.hide();
var aNodes=$("a");
//鼠标进入股票名称时的操作
aNodes.mouseover(function(event){
var aNode=$(this);
var divNode=aNode.parent();
divId=divNode.attr("id");
updateInfo();
//控制弹出框的位置
//var offset=aNode.offset();
//stockNode.css("left",offset.left+"px").css("top",offset.top+aNode.height()+"px");
var myEvent=event || window.event;
stockNode.css("left",myEvent.clientX+10+"px").css("top",myEvent.clientY+10+"px");
//显示弹出框
stockNode.show();
});
//鼠标离开股票名称时的操作
aNodes.mouseout(function(){
stockNode.hide();
});
getInfo();
//每一秒钟和服务器交互一次，更新数据信息
setInterval(getInfo,1000);
});
//更新弹出框中的信息
function updateInfo()
{
var stockObj=obj[divId];
for(var proName in stockObj){
if(proName !="name" && proName!="id"){
$("#"+proName).children("span").html(stockObj[proName]);
}
}
}
function getInfo()
{
//向服务器发送请求
$.get("handle/stock.ashx?t=" + (new Date()).valueOf(),function(data){
//接收解析数据
obj=eval(data);
//获取两只股票的当前指数
var szzs=obj["300001"];//obj.300001
var pfyh=obj["000001"];
/*
遍历一个对象
for(var stockid in obj)
{
var stock=obj[stockid];
}
*/
//找到相应的div节点
var sz= $("#300001").children("span")
sz.html(szzs.now);
if(szzs.now>szzs.yes){
//当前价格大于昨天收盘，则为红色
sz.css("color","red");
}else{
sz.css("color","green");
}
var pf=$("#000001").children("span")
pf.html(pfyh.now);
if(pfyh.now>szzs.pfyh){
//当前价格大于昨天收盘，则为红色
pf.css("color","red");
}else{
pf.css("color","green");
}
updateInfo();
});
}stock.ashx一般处理程序文件
<%@ WebHandler Language="C#" Class="stock" %>
using System;
using System.Web;
using System.Data;
using System.Collections;
using System.Collections.Generic;
using System.Text;
public class stock : IHttpHandler {
Hashtable ht = new Hashtable();
public void ProcessRequest (HttpContext context)
{
context.Response.ContentType = "text/plain";
init();
Random data=new Random();
double sz = data.NextDouble() * 20;
double pf = data.NextDouble() * 0.5;
//true涨，false跌
bool flagSz = ((int)(data.NextDouble() * 10)) % 2 == 0;
bool flagPf = ((int)(data.NextDouble() * 10)) % 2 == 0;
Stock szzs=(Stock)ht["300001"];
Stock pfyh=(Stock)ht["000001"];
double temp;
if (flagSz)
{
temp=szzs.Now + sz;
}
else
{
temp = szzs.Now - sz;
}
temp = Math.Round(temp, 2);
szzs.Now = temp;
if (flagPf)
{
temp = pfyh.Now + pf;
}
else
{
temp = pfyh.Now - pf;
}
temp = Math.Round(temp, 2);
pfyh.Now = temp;
//采用json的数据格式返回股票的信息
//1采用数组的方式返回两个股票信息
StringBuilder json = new StringBuilder();
//json.Append("[{name:\"").Append(szzs.Name).Append("\",id:\"").Append(szzs.Id).Append("\",yes:")
// .Append(szzs.Yesterday).Append(",tod:").Append(szzs.Today).Append(",now:")
// .Append(szzs.Now).Append("},{name:\"").Append(pfyh.Name).Append("\",id:\"")
// .Append(pfyh.Id).Append("\",yes:").Append(pfyh.Yesterday).Append(",tod:")
// .Append(pfyh.Today).Append(",now:").Append(pfyh.Now).Append("}]");
//1采用对象的方式返回两个股票信息
//以对象返回信息时，需要在最外面加上括号，否则页面解析会报错
json.Append("({")
.Append("\"")
.Append(szzs.Id).Append("\":{name:\"").Append(szzs.Name).Append("\",id:\"").Append(szzs.Id).Append("\",yes:")
.Append(szzs.Yesterday).Append(",tod:").Append(szzs.Today).Append(",now:").Append(szzs.Now)
.Append("},").Append("\"")
.Append(pfyh.Id).Append("\":{name:\"").Append(pfyh.Name).Append("\",id:\"").Append(pfyh.Id).Append("\",yes:")
.Append(pfyh.Yesterday).Append(",tod:").Append(pfyh.Today).Append(",now:").Append(pfyh.Now)
.Append("}})");
context.Response.Write(json);
}
private void init()
{
Stock szzs = new Stock(3000.0, 2999.0, "上证指数", "300001");
Stock pfyh = new Stock(23.22, 23.50, "浦发银行", "000001");
ht.Add(szzs.Id, szzs);
ht.Add(pfyh.Id, pfyh);
}
public bool IsReusable {
get {
return false;
}
}
}Stock.cs股票实体类文件
using System;
using System.Data;
using System.Configuration;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
/// <summary>
///股票实体类
/// </summary>
public class Stock
{
public Stock() { }
public Stock(double yesterday, double today, string name, string id)
{
this.yesterday = yesterday;
this.today = today;
this.name = name;
this.id = id;
this.now = today;
}
private double yesterday;
public double Yesterday
{
get { return yesterday; }
set { yesterday = value; }
}
private double today;
public double Today
{
get { return today; }
set { today = value; }
}
private double now;
public double Now
{
get { return now; }
set { now = value; }
}
private string name;
public string Name
{
get { return name; }
set { name = value; }
}
private string id;
public string Id
{
get { return id; }
set { id = value; }
}
}