背景：最近迷上炒股，如果可以在工作之余每天再多挣个百八十块钱，真的也不错。用手机看股票行情时总是要刷新网页，又或者想看的几个股票不在一个页面上，就只好自己动手写点东西来自动刷新页面，这个很简单拉。但是手机网络不太好，在网络不好时会导致本来显示的图片由于网络中断而自动刷新变成空白。于是就有了当网络好时自动刷新，网络不好时则维持刷新前的图片。
代码：
<!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>
<style >
* {padding:0;margin:0;position:relative;}
#body { border:solid 1px #f00 }
#img_test1,#img_test2 { display:none}
</style>
</head>
<body>
<div id = 'body'>
<div id = 'jh_jin'>
<h3>建行纸黄金价格<span id = 'jh_jin_date'></span>
刷新间隔:<input id = 'jh_jin_text' type='text' value = '60' onblur="setRefreshTime('img_test1',this.value*1000,refreshTest);" />s
</h3>
<img id ='jh_jin_img' src = 'http://price.zhjtong.com/1_jh_740_500.png' alt = '建行纸黄金价格'>
</img>
</div>
<div id = 'jh_yin'>
<h3>建行纸白银价格<span id = 'jh_yin_date'></span>
刷新间隔:<input id = 'jh_yin_text' type='text' value = '60' onblur="setRefreshTime('img_test2',this.value*1000,refreshTest);" />s
</h3>
<img id ='jh_yin_img' src = 'http://price.zhjtong.com/1_ccb_silver_740_500.png' alt = '建行纸白银价格'>
</img>
</div>
</div>
<img id = 'img_test1' src = 'http://gimg.baidu.com/img/gs.gif' onload = 'refresh("jh_jin");' alt = '测试网络'/>
<img id = 'img_test2' src = 'http://gimg.baidu.com/img/gs.gif' onload = 'refresh("jh_yin");' alt = '测试网络'/>
<script lang = 'javascript' >
var srcMap = {'jh_jin_img':$('jh_jin_img').src,'jh_yin_img':$('jh_yin_img').src,'img_test1':$('img_test1').src,'img_test2':$('img_test2').src};
var signalMap = {};
function $(id){
return document.getElementById(id);
}
function refresh(id){
if(!$(id))
return ;
var d = new Date();
$(id+'_date').innerHTML = d;
$(id+'_img').src = srcMap[id+'_img']+'?'+ d;
}
function refreshTest(id){
if(!$(id))
return ;
$(id).src = srcMap[id]+'?'+ new Date();
}
function setRefreshTime(id,t,fun){
clearInterval(signalMap[id]);
if(t > 0){
signalMap[id] = window.setInterval(function(){ fun(id)},t);
}
}
setRefreshTime('img_test1',60*1000,refreshTest);
setRefreshTime('img_test2',60*1000,refreshTest);
</script>
</body>
</html>
解决思路：通过img_test1来判断网络是否连通，如果网络连通了img_test1加载成功则刷新股票图片，否则不刷新维持上次的股票界面。