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>

以上是我的 html 和 javascript 代码 我对该函数的引用是http://www.w3schools.com/js/tryit.asp?filename=tryjs_lightbulb当您单击按钮时,此代码上的内容<div class='right'>将在之前更改函数的值change(),我的问题是我需要放置什么代码或函数以使图像刷新或自动刷新,示例我最后单击 PLC 按钮,我需要连续刷新以便 1.jpg pic 显示更新的图像. thx 对不起,我是 java 脚本中的新手 thx

4

2 回答 2

2

我不知道我是否 100% 理解您的问题,但是如果您需要每 N 秒刷新一次图像,则必须通过添加问号来更改其 URL(? ) 和一些随机内容(例如时间戳)来更改其 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);
于 2013-03-19T09:26:34.447 回答
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>
于 2013-03-19T09:19:01.333 回答