2013-03-19 111 views
1
<html> 
    <head> 
     <link rel='stylesheet' type='text/css' href='css/style.css'> 
     <base href='http://150.20.1.30'><base target='_self'> 
      <title>PLC</title> 
     <script> 
      function change(pic){ 
      element_buts=document.getElementById("pic"); 
       element_buts.src=pic;  
      } 
     </script> 
    </head> 
    <body> 
     <div class='content'> 
      <div class='left'> 
       <img src='1.jpg' height='80%' id='pic'> 
      </div> 
      <div class='right'> 
       <input type='button' class='buttons' value='PLC' onclick='change("1.jpg")'></br> 
       <input type='button' class='buttons' value='Furnace Draft' onclick='change("9.jpg")'></br> 
       <input type='button' class='buttons' value='Drum Level Graph' onclick='change("3.jpg")'></br> 
       <input type='button' class='buttons' value='Boiler Blowdown Time Setup' onclick='change("10.jpg")'></br> 
       <input type='button' class='buttons' value='Steam Press and Flow Graph' onclick='change("4.jpg")'></br> 
       <input type='button' class='buttons' value='Boiler Drum and Dearator Level' onclick='change("5.jpg")'></br> 
       <input type='button' class='buttons' value='Stack and Dearator Temperature' onclick='change("7.jpg")'></br> 
       <input type='button' class='buttons' value='Steam Flow and Pressure Graphs' onclick='change("8.jpg")'></br> 
       <div class='footer_right'> 
       </div> 
      </div> 
     </div> 
    </body> 
</html> 

src属性上面是我的HTML和JavaScript代码,我该函数的引用是http://www.w3schools.com/js/tryit.asp?filename=tryjs_lightbulb当您单击按钮内部<div class='right'>图像将被之前的值更改为这个代码是什么功能change(),我的问题是什么代码或功能,我需要把图像刷新或自动刷新,示例我最后点击PLC按钮,我需要连续刷新,以便1.jpg图片显示更新的图像。 thx对不起,我在java脚本thx新手自动刷新的IMG

+4

[从不使用W3Schools的(http://w3fools.com) – SomeShinyObject 2013-03-19 09:11:40

+0

有一个在代码中的任何*自动*刷新没有尝试。发布的代码看起来不相关,很难猜测问题的真实性。 – 2013-03-19 10:03:55

回答

0

只是看着它,我敢肯定你的代码的作品。 那么我知道这是。

<img id="pic" src="https://www.google.com.au/images/srpr/logo4w.png"/> 
<input type="button" value ="Yahoo" onclick="change('http://l.yimg.com/ao/i/mp/properties/frontpage/eclipse/img/y7-logo_default.v1.png')" /> 
<input type="button" value ="Google" onclick="change('https://www.google.com.au/images/srpr/logo4w.png')" />  

<script> 
    function change(src){ 
     document.getElementById('pic').src = src; 
    } 
</script> 
2

我不知道我是否100%理解你的问题,但如果你需要一个像每N秒被刷新,您必须通过添加一个问号(?)和一些随机的东西改变它的URL之后(例如时间戳)。

该代码会为你工作:

// Let's set refresh time to 5 seconds 
var N = 5; 

// Function that refreshes image 
function refresh(imageId, imageSrc) { 
    var image = document.getElementById(imageId); 
    var timestamp = new Date().getTime(); 
    image.src = imageSrc + '?' + timestamp;  
} 

// Refresh image every N seconds 
setTimeout(function() { 
    refresh('pic', 'myImage.jpg'); 
}, N * 1000); 
+0

'new Date()。getTime()'返回自unix时代以来的毫秒数(例如'1392692601831'),这很好,因为这几乎是唯一的。 – 2014-02-18 03:05:45