ajax无刷新动态调用股票信息(改良版)


Posted in Javascript onNovember 01, 2008
<html> 
<head> 
<title>ajax test</title> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript">... 
function ajaxRequest()...{ 
var url = $("#stockurl").val() + $("#stockinit").val(); 
$.ajax(...{ 
url: url, 
type: 'GET', 
dataType: 'html', 
timeout: 2000, 
success: function(response)...{ 
var stocks = response.split(';'); 
for(var i=0; i<stocks.length-1; i++)...{ 
var content = stocks[i]; 
var temp1 = content.split('=')[0]; 
var temp2 = content.split('=')[1]; 
var code = temp1.substr(temp1.length - 6, 6); 
var temp3 = temp2.replace('"', ''); 
var name = temp3.split(',')[0]; 
var tday_f = temp3.split(',')[1]; 
var yest_f = temp3.split(',')[2]; 
var curr_f = temp3.split(',')[3]; 
var temp_f = curr_f - yest_f; $('#a'+i).html(code); 
$('#b'+i).html(name); 
if(curr_f > yest_f) ...{ 
$('#c'+i).html("<font color='red'>" + curr_f + "</font>"); 
} else if(curr_f < yest_f) ...{ 
$('#c'+i).html("<font color='green'>" + curr_f + "</font>"); 
} else ...{ 
$('#c'+i).html(curr_f); 
} 
$('#d'+i).html(tday_f); 
$('#e'+i).html(yest_f); 
if(temp_f > 0) ...{ 
$('#f'+i).html("<font color='red'>" + temp_f.toFixed(2) + "</font>"); 
$('#g'+i).html("<font color='red'>" + ((temp_f / yest_f) * 100).toFixed(2) + "</font> % "); 
} else if(temp_f < 0) ...{ 
$('#f'+i).html("<font color='green'>" + temp_f.toFixed(2) + "</font>"); 
$('#g'+i).html("<font color='green'>" + ((temp_f / yest_f) * 100).toFixed(2) + "</font> % "); 
} else ...{ 
$('#f'+i).html(temp_f.toFixed(2)); 
$('#g'+i).html(((temp_f / yest_f) * 100).toFixed(2) + " % "); 
} 
$('#h'+i).html(temp3.split(',')[4]); 
$('#i'+i).html(temp3.split(',')[5]); 
} 
} 
}); 
} 
$(document).ready(function()...{ 
var stocks = $("#stockinit").val().split(','); 
for(var i=0; i<stocks.length; i++)...{ 
addRows(); 
} 
$("#insrow").click(function()...{ 
var stockcd = $("#stockid").val(); 
if(stockcd == "")...{ 
alert("股票代号不能为空!"); 
$("#stockid").focus(); 
return; 
} 
if(stockcd.length != 6)...{ 
alert("股票代号只能是6位!"); 
$("#stockid").focus(); 
return; 
} 
var div = 'sh'; 
if(document.getElementById("sz_id").checked)...{ div = "sz";} 
var stocks = $("#stockinit").val(); 
$("#stockinit").val(stocks + "," + div + stockcd); 
addRows(); 
}); 
$("#delrow").click(function()...{ 
var table = document.getElementById("tableId"); 
var index = table.rows.length; 
if (index < 2)...{ 
alert("已经没有可删除的行了!"); 
} else ...{ 
table.deleteRow(index - 1); 
var stockvalue = $("#stockinit").val(); 
var count = stockvalue.split(',').length; 
if(count == 1) ...{ 
stockvalue = ""; 
} else ...{ 
stockvalue = stockvalue.substr(0, stockvalue.length - 9); 
} 
$("#stockinit").val(stockvalue); 
} 
}); 
window.setInterval("ajaxRequest()",3000); 
}); 
function addRows()...{ 
var table = document.getElementById("tableId"); 
var index = table.rows.length; 
var str=""; 
var row = index - 1; 
str+='<tr class="tr_cls">' 
str+='<td align="center"><span id="' + "a" + row + '"></span></td>' 
str+='<td align="center"><span id="' + "b" + row + '"></span></td>' 
str+='<td align="center"><span id="' + "c" + row + '"></span></td>' 
str+='<td align="center"><span id="' + "d" + row + '"></span></td>' 
str+='<td align="center"><span id="' + "e" + row + '"></span></td>' 
str+='<td align="center"><span id="' + "f" + row + '"></span></td>' 
str+='<td align="center"><span id="' + "g" + row + '"></span></td>' 
str+='<td align="center"><span id="' + "h" + row + '"></span></td>' 
str+='<td align="center"><span id="' + "i" + row + '"></span></td>' 
str+='</tr>'; 
$("#tablebody").append(str); 
} 
</script> 
<style>... 
.tr_cls {...}{ 
height:30px; 
font-size:16px; 
font-family:"Times New Roman", Times, serif; 
background-color:#FFFFCC 
} 
</style> 
</head> 
<body> 
<form> 
<input type="hidden" id="stockurl" value="http://hq.sinajs.cn/list=" /> 
<input type="hidden" id="stockinit" value="sh000001,sz399001,sh601939,sh600016,sh600528,sh600667,sh601390,sh601857,sz000532,sh600019,sh601111,sh601600,sh601006,sh601333,sh601398,sh601988,sh601328" /> 
<table width="800" border="0" align="center" cellpadding="0" cellspacing="0" > 
<tr> 
<td width="115px"> 
代号:<input type="text" id="stockid" size="6"> 
</td> 
<td width="150px"> 
区分:上海<input type="radio" name="rad" id="sh_id" checked>深证<input type="radio" name="rad" id="sz_id"> 
</td> 
<td width="40px"> 
<input type="button" id="insrow" value="行追加"> 
</td> 
<td width="495px"> 
<input type="button" id="delrow" value="行削除"> 
</td> 
</tr> 
<tr> 
<td colspan="4"> 
<div style="overflow-y:scroll; overflow-x:auto; height:392px; width:817px"> 
<table id="tableId" width="800" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#000000"> 
<tr bgcolor="#3399FF" height="30px"> 
<th scope="col">股票代号</th> 
<th scope="col">股票名称</th> 
<th scope="col">当前价格</th> 
<th scope="col">今日开盘</th> 
<th scope="col">昨日收盘</th> 
<th scope="col">当前差价</th> 
<th scope="col">涨跌幅度</th> 
<th scope="col">最高价格</th> 
<th scope="col">最低价格</th> 
</tr> 
<tbody id="tablebody"> 
</tbody> 
</table> 
</div> 
</td> 
</tr> 
</table> 
</form> 
</body> 
</html>
Javascript 相关文章推荐
Javascript调试工具(下载)
Jan 09 Javascript
Prototype Number对象 学习
Jul 19 Javascript
删除条目时弹出的确认对话框
Jun 05 Javascript
JS 排序输出实现table行号自增前端动态生成的tr
Aug 13 Javascript
AngularJS的内置过滤器详解
May 14 Javascript
Bootstrap基础学习
Jun 16 Javascript
详解javascript实现瀑布流绝对式布局
Jan 29 Javascript
AngularJS入门教程之AngularJS 模板
Aug 18 Javascript
微信小程序 开发经验整理
Feb 15 Javascript
微信小程序实现图片选择并预览功能
Jul 25 Javascript
vue实现户籍管理系统
May 29 Javascript
echarts饼图各个板块之间的空隙如何实现
Dec 01 Javascript
使用EXT实现无刷新动态调用股票信息
Nov 01 #Javascript
让任务管理器中的CPU跳舞的js代码
Nov 01 #Javascript
js CSS操作方法集合
Oct 31 #Javascript
xml分页+ajax请求数据源+dom取结果实例代码
Oct 31 #Javascript
JS Array对象入门分析
Oct 30 #Javascript
ajaxControlToolkit AutoCompleteExtender的用法
Oct 30 #Javascript
编写跨浏览器的javascript代码必备[js多浏览器兼容写法]
Oct 29 #Javascript
You might like
深入理解PHP JSON数组与对象
2016/07/19 PHP
PHP加密技术的简单实现
2016/09/04 PHP
jQuery弹出层插件简化版代码下载
2008/10/16 Javascript
jQuery 对象中的类数组操作
2009/04/27 Javascript
javascript 流畅动画实现原理
2009/09/08 Javascript
jQuery中index()的用法分析
2014/09/05 Javascript
使用javascript实现监控视频播放并打印日志
2015/01/05 Javascript
JavaScript获得表单target属性的方法
2015/04/02 Javascript
基于JavaScript代码实现兼容各浏览器的设为首页和加入收藏
2016/01/07 Javascript
JS中如何比较两个Json对象是否相等实例代码
2016/07/13 Javascript
浅谈Cookie的生命周期问题
2016/08/02 Javascript
Reactjs实现通用分页组件的实例代码
2017/01/19 Javascript
canvas绘制的直线动画
2017/01/23 Javascript
nodejs个人博客开发第四步 数据模型
2017/04/12 NodeJs
源码分析Vue.js的监听实现教程
2017/04/23 Javascript
JS基于封装函数实现的表格分页完整示例
2018/06/26 Javascript
分享5个好用的javascript文件上传插件
2018/09/16 Javascript
vue实现Excel文件的上传与下载功能的两种方式
2019/06/28 Javascript
在Vue 中获取下拉框的文本及选项值操作
2020/08/13 Javascript
pygame学习笔记(2):画点的三种方法和动画实例
2015/04/15 Python
浅谈MySQL中的触发器
2015/05/05 Python
深入解析Python中的变量和赋值运算符
2015/10/12 Python
转换科学计数法的数值字符串为decimal类型的方法
2018/07/16 Python
python requests 库请求带有文件参数的接口实例
2019/01/03 Python
Django的性能优化实现解析
2019/07/30 Python
Django ORM 自定义 char 类型字段解析
2019/08/09 Python
python dumps和loads区别详解
2020/02/04 Python
Python使用shutil模块实现文件拷贝
2020/07/31 Python
selenium如何定位span元素的实现
2021/01/13 Python
css3实现冲击波效果的示例代码
2018/01/11 HTML / CSS
西班牙最大的在线滑板和街头服饰商店:Fillow.net
2019/04/15 全球购物
生产部统计员岗位职责
2014/01/05 职场文书
乡镇组织委员个人整改措施
2014/09/16 职场文书
思想纪律作风整顿剖析材料
2014/10/11 职场文书
高校自主招生自荐信2015
2015/03/04 职场文书
三国演义读书笔记
2015/06/25 职场文书