设置一段时间的显示图像和脚本

Question

这与我前几天询问的问题非常相似，但是我的页面代码变得非常复杂，我需要重新访问它。我已经使用以下代码：

$('#myLink').click(function() { 
    $('#myImg').attr('src', 'newImg.jpg'); 
    setTimeout(function() { $('#myImg').attr('src', 'oldImg.jpg'); }, 15000); 
}); 

要设定的时间周期（15秒）链接被点击时，然后在15秒后，恢复到原来的图像替换图像。

但是现在，我想运行一个JavaScript代码片段，当链接被点击（除了替换图片），并且只有当链接被点击（它与第15张图片相关）和然后让js代码在15秒后消失......但是我不确定如何让jquery将js代码发送到页面中......基本上我只是希望jQuery将该代码“回显”到页面底部虽然我在那里15秒，但我不知道jQuery如何格式化这个“回声”。

这个问题有意义吗？

interval = 500; 
    imgsrc = "webcam/image.jpg"; 

    function Refresh() { 
    tmp = new Date(); 
    tmp = "?" + tmp.getTime(); 
    document.images["image1"].src = imgsrc + tmp; 
    setTimeout("Refresh()", interval); 
    } 

    Refresh(); 

这是一个摄像头的脚本。基本上它每半秒钟拍摄一张新照片并将其替换在页面上。你必须原谅我，我是jquery的新手，我不知道如何让这个脚本在jQuery环境下工作。

Answer 1

如果要间隔运行某些操作，请使用setInterval()，与setTimeout()类似。

如果将setInterval()分配给变量，则可以使用该变量来“清除”该变量。在你的setTimeout()函数中这样做。

$('#myLink').click(function() { 
    // Start setInterval which runs a function every n seconds, and assign it to a variable 
    var runningInterval = setInterval(function() {...}, 500); 

    $('#myImg').attr('src', 'newImg.jpg'); 

    // After 15 seconds, clear the runningInterval, and reset the image. 
    setTimeout(function() { clearInterval(runningInterval); $('#myImg').attr('src', 'oldImg.jpg'); }, 15000); 
}); 

---

编辑：

好了，所以，在这里它与你的代码。

interval = 500; 
    imgsrc = "webcam/image.jpg"; 

    // Is this function getting called? 
    function Refresh() { 
    tmp = new Date(); 
    tmp = "?" + tmp.getTime(); 

     // You could use jQuery here, just like below. 
    document.images["image1"].src = imgsrc + tmp; 
    } 

    $('#myLink').click(function() { 
     // Start setInterval which runs your Refresh function every 0.5 seconds, and assign it to a variable 
     var runningInterval = setInterval(Refresh, interval); 

     // Display new image 
     // This line may be unnecessary if the Refresh() function is loading it anyway. 
     $('#myImg').attr('src', 'newImg.jpg'); 

     // After 15 seconds, clear the runningInterval, and reset the image. 
     setTimeout(function() { clearInterval(runningInterval); $('#myImg').attr('src', 'oldImg.jpg'); }, 15000); 

     return false; 
    }); 

Answer 2

这可能取决于代码的作用。

不要以页面源代码来思考。根据DOM考虑。

这很可能是您要注入的JavaScript处理某种事件（它是一个事件处理程序）。因此，在初始点击时，您想要将该函数绑定（附加）到适当的事件，然后将其解除绑定到setTimeout函数中。

如果你不想启用/禁用某些行为，那么我们可以使用更多关于你的临时javascript是如何提供更好的指导的信息。

Answer 3

因此，像：

var original_url = ''; 
var second_url = 'http://example.com/path/to/image.jpg'; 
var delay_in_milliseconds = 15000 

function resetImage() { 
    $('#myImg').attr('src', original_url); 
} 

$(document).ready(function() { 
    original_url = $('#myImg').attr('src'); 
    $('#myImg').attr('src', second_url); 
    setTimeout(resetImage, delay_in_milliseconds) 
}); 

假设此标记：

<img id="myImg" src="another/path/to/another/image.jpg" /> 

我想我理解你的问题，但随时，如果你认为它需要它来修改它。