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

类似于：

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" />

我认为我理解你的问题，但如果你认为需要，可以随意修改它。

Answer 3

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

不要考虑页面来源。考虑DOM。

您想要注入的javascript可能会处理某种事件（它是一个事件处理程序）。因此，在初始单击时，您希望将该函数绑定（附加）到正确的事件，然后在setTimeout'd函数中解除绑定。

如果您没有尝试启用/禁用某些行为，那么我们可以使用有关此临时JavaScript正在执行的操作的更多信息来提供更好的指导。

在一段时间内显示图像和脚本

3 个答案: