您好,登錄后才能下訂單哦!
本篇內容介紹了“如何使用ajax技術無刷新動態調用新浪股票實時數據”的有關知識,在實際案例的操作過程中,不少人都會遇到這樣的困境,接下來就讓小編帶領大家學習一下如何處理這些情況吧!希望大家仔細閱讀,能夠學有所成!
<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()...{ $.ajax(...{ url: 'http://hq.sinajs.cn/list=sh000001,sh701939,sh700016,sh700528,sh700667,sh701390,sh701398,sh701857,sh700028', 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]); } } }); } function pageInit() ...{ window.setInterval("ajaxRequest()",3000); } </script> <style>... .tr_cls {...}{ height:30px; font-size:16px; font-family:"Times New Roman", Times, serif; background-color:#FFFFCC } </style> </head> <body onLoad="pageInit();"> <form> <table 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> <tr class="tr_cls"> <td align="center"><span id="a0"></span></td> <td align="center"><span id="b0"></span></td> <td align="center"><span id="c0"></span></td> <td align="center"><span id="d0"></span></td> <td align="center"><span id="e0"></span></td> <td align="center"><span id="f0"></span></td> <td align="center"><span id="g0"></span></td> <td align="center"><span id="h0"></span></td> <td align="center"><span id="i0"></span></td> </tr> <tr class="tr_cls"> <td align="center"><span id="a1"></span></td> <td align="center"><span id="b1"></span></td> <td align="center"><span id="c1"></span></td> <td align="center"><span id="d1"></span></td> <td align="center"><span id="e1"></span></td> <td align="center"><span id="f1"></span></td> <td align="center"><span id="g1"></span></td> <td align="center"><span id="h2"></span></td> <td align="center"><span id="i1"></span></td> </tr> <tr class="tr_cls"> <td align="center"><span id="a2"></span></td> <td align="center"><span id="b2"></span></td> <td align="center"><span id="c2"></span></td> <td align="center"><span id="d2"></span></td> <td align="center"><span id="e2"></span></td> <td align="center"><span id="f2"></span></td> <td align="center"><span id="g2"></span></td> <td align="center"><span id="h3"></span></td> <td align="center"><span id="i2"></span></td> </tr> <tr class="tr_cls"> <td align="center"><span id="a3"></span></td> <td align="center"><span id="b3"></span></td> <td align="center"><span id="c3"></span></td> <td align="center"><span id="d3"></span></td> <td align="center"><span id="e3"></span></td> <td align="center"><span id="f3"></span></td> <td align="center"><span id="g3"></span></td> <td align="center"><span id="h4"></span></td> <td align="center"><span id="i3"></span></td> </tr> <tr class="tr_cls"> <td align="center"><span id="a4"></span></td> <td align="center"><span id="b4"></span></td> <td align="center"><span id="c4"></span></td> <td align="center"><span id="d4"></span></td> <td align="center"><span id="e4"></span></td> <td align="center"><span id="f4"></span></td> <td align="center"><span id="g4"></span></td> <td align="center"><span id="h5"></span></td> <td align="center"><span id="i4"></span></td> </tr> <tr class="tr_cls"> <td align="center"><span id="a5"></span></td> <td align="center"><span id="b5"></span></td> <td align="center"><span id="c5"></span></td> <td align="center"><span id="d5"></span></td> <td align="center"><span id="e5"></span></td> <td align="center"><span id="f5"></span></td> <td align="center"><span id="g5"></span></td> <td align="center"><span id="h6"></span></td> <td align="center"><span id="i5"></span></td> </tr> <tr class="tr_cls"> <td align="center"><span id="a6"></span></td> <td align="center"><span id="b6"></span></td> <td align="center"><span id="c6"></span></td> <td align="center"><span id="d6"></span></td> <td align="center"><span id="e6"></span></td> <td align="center"><span id="f6"></span></td> <td align="center"><span id="g6"></span></td> <td align="center"><span id="h7"></span></td> <td align="center"><span id="i6"></span></td> </tr> <tr class="tr_cls"> <td align="center"><span id="a7"></span></td> <td align="center"><span id="b7"></span></td> <td align="center"><span id="c7"></span></td> <td align="center"><span id="d7"></span></td> <td align="center"><span id="e7"></span></td> <td align="center"><span id="f7"></span></td> <td align="center"><span id="g7"></span></td> <td align="center"><span id="h7"></span></td> <td align="center"><span id="i7"></span></td> </tr> <tr class="tr_cls"> <td align="center"><span id="a8"></span></td> <td align="center"><span id="b8"></span></td> <td align="center"><span id="c8"></span></td> <td align="center"><span id="d8"></span></td> <td align="center"><span id="e8"></span></td> <td align="center"><span id="f8"></span></td> <td align="center"><span id="g8"></span></td> <td align="center"><span id="h8"></span></td> <td align="center"><span id="i8"></span></td> </tr> </table> </form> </body> </html>
習慣用prototype的,把腳本部分的代碼替換一下即可。
復制代碼 代碼如下:
<script type="text/javascript" src="prototype.js"></script> <script type="text/javascript">... function ajaxRequest()...{ var myAjax = new Ajax.Request( 'http://hq.sinajs.cn/list=sh000001,sh701939,sh700016,sh700528,sh700667,sh701390,sh701398,sh701857,sh700028', ...{ method: 'get', onComplete: setData } ); } function setData(response) ...{ var contents = response.responseText; var stocks = contents.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).innerHTML = code; $('b'+i).innerHTML = name; $('c'+i).innerHTML = curr_f; if(curr_f > yest_f) ...{ $('c'+i).innerHTML = "<font color='red'>" + curr_f + "</font>"; } else if(curr_f < yest_f) ...{ $('c'+i).innerHTML = "<font color='green'>" + curr_f + "</font>"; } else ...{ $('c'+i).innerHTML = curr_f; } $('d'+i).innerHTML = tday_f; $('e'+i).innerHTML = yest_f; if(temp_f > 0) ...{ $('f'+i).innerHTML = "<font color='red'>" + temp_f.toFixed(2) + "</font>"; $('g'+i).innerHTML = "<font color='red'>" + ((temp_f / yest_f) * 100).toFixed(2) + "</font> %"; } else if(temp_f < 0) ...{ $('f'+i).innerHTML = "<font color='green'>" + temp_f.toFixed(2) + "</font>"; $('g'+i).innerHTML = "<font color='green'>" + ((temp_f / yest_f) * 100).toFixed(2) + "</font> %"; } else ...{ $('f'+i).innerHTML = temp_f.toFixed(2); $('g'+i).innerHTML = ((temp_f / yest_f) * 100).toFixed(2) + " % "; } $('h'+i).innerHTML = temp3.split(',')[4]; $('i'+i).innerHTML = temp3.split(',')[5]; } } function pageInit() ...{ window.setInterval("ajaxRequest()",3000); } </script>
“如何使用ajax技術無刷新動態調用新浪股票實時數據”的內容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業相關的知識可以關注億速云網站,小編將為大家輸出更多高質量的實用文章!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。