简单的新浪股票API调用
以后有时间,还记得的话,再做成JQuery 插件吧
-----
用到的东西:
1. sina stock API
2. JQuery [$.getScript()]
3. JS [Date.prototype.format]
-----
效果图:
-----
代码:
1 <!DOCTYPE html> 2 <head> 3 <title>CGM003</title> 4 <script src="js/libs/jquery-1.11.0.js"></script> 5 <style> 6 body{ 7 font-size:13px; 8 } 9 td{ 10 padding:1px 2px; 11 border-bottom:1px solid gray; 12 text-align:right; 13 vertical-align:bottom; 14 white-space:nowrap; 15 } 16 .red{ 17 color:red; 18 } 19 .green{ 20 color:green; 21 } 22 #infoTbl{ 23 font-size:15px; 24 } 25 </style> 26 </head> 27 <body> 28 <section> 29 <header> 30 间隔:<input type="number" id="refreshTime" min="100" max="5000" value="1000" />毫秒 31 <span id="refresh" style="cursor:pointer; text-decoration:underline; color:blue;"></span> 32 <span id="lastTime"></span> 33 (字体: <span style="cursor:pointer; text-decoration:underline; color:blue;" onclick="$('#infoTbl').css('font-size','15px');">小</span> <span style="cursor:pointer; text-decoration:underline; color:blue;" onclick="$('#infoTbl').css('font-size','20px');">中</span> <span style="cursor:pointer; text-decoration:underline; color:blue;" onclick="$('#infoTbl').css('font-size','25px');">大</span> <span style="cursor:pointer; text-decoration:underline; color:blue;" onclick="$('#infoTbl').css('font-size','55px');">超</span>) 34 <br /> 35 <select id="market"> 36 <option value="sh" selected >上海</option> 37 <option value="sz" >深圳</option> 38 </select> 39 代码: 40 <input type="text" size="7" id="code" value='' /> 41 <span style="cursor:pointer; text-decoration:underline; color:blue;" onclick="addStock();">添加</span> 42 </header> 43 <article> 44 <table id="infoTbl"> 45 </table> 46 </article> 47 </section> 48 49 <script> 50 // prototype of Date to add [format] meathod 51 Date.prototype.format = function(format){ 52 var o = { 53 "M+" : this.getMonth()+1, //month 54 "d+" : this.getDate(), //day 55 "h+" : this.getHours(), //hour 56 "m+" : this.getMinutes(), //minute 57 "s+" : this.getSeconds(), //second 58 "q+" : Math.floor((this.getMonth()+3)/3), //quarter 59 "S" : this.getMilliseconds() //millisecond 60 } 61 62 if(/(y+)/.test(format)) { 63 format = format.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length)); 64 } 65 66 for(var k in o) { 67 if(new RegExp("("+ k +")").test(format)) { 68 format = format.replace(RegExp.$1, RegExp.$1.length==1 ? o[k] : ("00"+ o[k]).substr((""+ o[k]).length)); 69 } 70 } 71 return format; 72 }; 73 // array remove all 74 Array.prototype.removeAll = function() 75 { 76 while(this.length > 0) 77 this.pop(); 78 } 79 // var init 80 var stockList = ["sh000001","sh600461","sh601186","sh601628","sz399001"], 81 rowHtml = "<tr style='color:{%C%};'><td>{%Nm%}</td><td><b>{%Now%}</b></td><td>{%DiffPrice%}</td><td>{%DiffPer%}</td><td>{%Vol%}</td><td style='color:{%HighC%};'>{%High%}</td><td style='color:{%lowC%};'>{%Low%}</td><td>{%delete%}</td><td>{%More%}</td></tr>", 82 nowT, 83 IntervalObj = null, 84 refreshSpan; 85 86 // 不在申请的js Url后加时间 87 $.ajaxSetup({ 88 cache: true 89 }); 90 91 // init fun 92 $(function(){ 93 refreshSpan = $("#refreshTime").val(); 94 $("#refresh").html("开始刷新").click(function(e){ 95 if(null != IntervalObj){ 96 clearInterval(IntervalObj); 97 IntervalObj = null; 98 $(this).html("开始刷新"); 99 }else{ 100 doRefresh(); 101 IntervalObj = setInterval(doRefresh,refreshSpan); 102 $(this).html("停止刷新"); 103 } 104 }); 105 $("#refresh").click(); 106 }); 107 function doRefresh(){ 108 refreshSpan = $("#refreshTime").val(); 109 nowT = new Date().format("yyyyMMddhhmmssSS"); 110 $("#infoTbl").html(""); 111 for(var i = 0; i < stockList.length; i++){ 112 $.getScript('http://hq.sinajs.cn/a='+nowT+'&list=' + stockList[i],callBack1(stockList[i])); 113 } 114 } 115 function callBack1(nm){ 116 var goOn = true; 117 eval("if('undefined' == typeof(hq_str_"+nm+")) goOn = false;"); 118 if(goOn){ 119 //try{ 120 eval("var tmpStr = hq_str_"+nm+";"); 121 var tmp = tmpStr.split(","); 122 var rowStr = rowHtml; 123 rowStr = rowStr.replace(new RegExp("{%Nm%}", 'g'), tmp[0]); 124 rowStr = rowStr.replace(new RegExp("{%Now%}", 'g'), tmp[3]); 125 rowStr = rowStr.replace(new RegExp("{%C%}", 'g'), (tmp[3]-tmp[2])>0?"red":((tmp[3]-tmp[2])<0?"green":"gray")); 126 rowStr = rowStr.replace(new RegExp("{%DiffPrice%}", 'g'), Math.round((tmp[3]-tmp[2])*100) / 100); 127 rowStr = rowStr.replace(new RegExp("{%DiffPer%}", 'g'), Math.round((tmp[3]-tmp[2])/tmp[2] * 10000) / 100 +"%"); 128 rowStr = rowStr.replace(new RegExp("{%Vol%}", 'g'), tmp[8]/100); 129 rowStr = rowStr.replace(new RegExp("{%High%}", 'g'), tmp[4]); 130 rowStr = rowStr.replace(new RegExp("{%HighC%}", 'g'), (tmp[4]>tmp[3])?"red":((tmp[4]<tmp[3])?"green":"gray")); 131 rowStr = rowStr.replace(new RegExp("{%Low%}", 'g'), tmp[5]); 132 rowStr = rowStr.replace(new RegExp("{%LowC%}", 'g'), (tmp[5]>tmp[3])?"red":((tmp[5]<tmp[3])?"green":"gray")); 133 rowStr = rowStr.replace(new RegExp("{%delete%}", 'g'),"<span title='删除' style='cursor:pointer;' onclick='$(this).parent().parent().remove();delStock(""+nm+"")'>删除</span>"); 134 //rowStr = rowStr.replace(new RegExp("{%More%}", 'g'), "<img height='100' src='http://image.sinajs.cn/newchart/min/n/"+nm+".gif' />"); // 图片 135 rowStr = rowStr.replace(new RegExp("{%More%}", 'g'),""); 136 137 $("#infoTbl").append(rowStr); 138 $("#lastTime").html((new Date()).format("hh:mm:ss")); 139 //}catch(e){clearInterval(IntervalObj);} 140 } 141 } 142 function delStock(nm){ 143 var delIndex = -1; 144 for(var i = 0; i < stockList.length; i++){ 145 if(stockList[i]==nm){ 146 delIndex = i; 147 break; 148 } 149 } 150 if(delIndex != -1) 151 stockList.splice(delIndex,1); 152 } 153 function addStock(){ 154 var delIndex = -1; 155 var cd = $("#market").val() + "" + $("#code").val(); 156 for(var i = 0; i < stockList.length; i++){ 157 if(stockList[i]==cd){ 158 delIndex = i; 159 break; 160 } 161 } 162 if(delIndex == -1){ 163 stockList.push(cd); 164 $("#refresh").click().click(); 165 console.log(cd); 166 }else{ 167 alert("已存在"); 168 } 169 } 170 </script> 171 </body> 172 </html>
-----
CSDN下载地址: