使用ajax技术无刷新动态调用股票信息(追加分时图显示)

最新推荐文章于 2024-09-11 20:28:45 发布

原创最新推荐文章于 2024-09-11 20:28:45 发布 · 2.9k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#ajax #function #input #div #table #button

Ajax技术专栏收录该内容

103 篇文章

订阅专栏

追加了股票信息分时图。但是在测试过程中发现，img标签的src属性可能老是会去读取先前下载的缓存而无法即时更新网上的图片。希望大虾可以帮我看看，不甚感激。

<html>

<head>

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;

$('#o'+i).val(temp1.substr(temp1.length - 8, 8));

$('#a'+i).html(code);

$('#b'+i).html(name);

if(parseFloat(curr_f) > parseFloat(yest_f)) {

$('#c'+i).html("<font color='red'>" + curr_f + "</font>");

} else if(parseFloat(curr_f) < parseFloat(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(parseFloat(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(parseFloat(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" onMouseOver="mouseOver(' + row + ', event);" onMouseOut="mouseOut(' + row + ')"><input type="hidden" id="' + "o" + row + '"/><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);

}

function mouseOver(row, event){

var stockId = $('#o'+row).val();

if (stockId == "") return;

var top, left;

if (navigator.appName == "Microsoft Internet Explorer") {

left = event.x;

top = event.y;

} else {

left = event.pageX;

top = event.pageY;

}

if (top > 300) top = top - 300;

var div = document.getElementById("picDiv");

div.style.left = left;

div.style.top = top;

div.innerHTML = '<img src="http://image.sinajs.cn/newchart/min/n/' + stockId + '.gif" width="545" height="300"/>';

}

function mouseOut(row){

var div = document.getElementById("picDiv");

div.innerHTML = '';

}

</script>

<style>

.tr_cls {

height:30px;

font-size:16px;

font-family:"Times New Roman", Times, serif;

background-color:#FFFFCC

}

</style>

</head>

<form>

<tr>

代号:<input type="text" id="stockid" size="6">

</td>

区分:上海<input type="radio" name="rad" id="sh_id" checked>深证<input type="radio" name="rad" id="sz_id">

</td>

</td>

</td>

</tr>

<tr>

</tr>

</tbody>

</table>

</div>

</td>

</tr>

</table>

</form>

</body>

</html>

6 条评论

昆山人在上海 2007.12.19
我也试了，的确可以的。多谢了！

simonk 2007.12.19
试了一下，这样写就可以了，不用RANDOM了。 div.innerHTML = '<img src="http://image.sinajs.cn/newchart/min/n/' + stockId + '.gif?1193115166545" width="545" height="300"/>';