отображать изображение и скрипт в течение заданного периода времени - PullRequest
1 голос
/ 03 мая 2010

Это очень похоже на вопрос, который я задал на днях, но код моей страницы значительно усложнился, и мне нужно вернуться к нему. Я использовал следующий код:

$('#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.

Ответы [ 3 ]

2 голосов
/ 03 мая 2010

Если вы хотите что-то запустить с интервалом, используйте 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);
});

EDIT:

Хорошо, вот оно с вашим кодом.

  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;
  });
1 голос
/ 03 мая 2010

Так что-то вроде:

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

Я думаю, что понимаю ваш вопрос, но не стесняйтесь пересматривать его, если вы считаете, что это нужно.

0 голосов
/ 03 мая 2010

Вероятно, это зависит от того, что делает код.

Не думайте с точки зрения источника страницы. Думайте в терминах DOM.

Вполне вероятно, что javascript, который вы хотите внедрить, обрабатывает какое-то событие (это обработчик события). Поэтому при первом щелчке вы хотите связать (прикрепить) эту функцию с соответствующим событием, а затем отсоединить ее в функции setTimeout.

Если вы не пытаетесь включить / отключить какое-либо поведение, тогда мы могли бы использовать больше информации о том, что делает ваш временный JavaScript, чтобы предоставить более качественные рекомендации.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...