Блог

Привет, у меня есть скрипт, который изменяет источник изображения, т.Е. webpics/1.jpg для webpics/2.jpg при нажатии на изображение. Одна проблема, с которой я сталкиваюсь, заключается в том, что скрипт все равно будет работать для еще одного изображения после того, как появятся изображения, поэтому, если у меня есть 11 изображений, я могу нажать next 11 раз и получу пустое изображение, я бы хотел, чтобы скрипт запустил проверку на ошибку и остался на текущем изображении, если следующего не существует. Вот сценарий:

 $("#prev, #next").click(function() { 
var currentNumber = parseInt($("#image1").attr("src").split('gallery/')[1]); // get the
number
var newNumber = ($(this).attr("id")=="next")?currentNumber 1:currentNumber-1;
var testImage = new Image();
testImage.onload=function() {
var img = $("#image1");
img.attr("src",this.src);
img.css("visibility","visible");   
}
testImage.onerror=function() {
$("#image1").css("visibility","hidden");   
} 
testImage.src="http://www.yogahealth.net.au/gallery/" newNumber ".jpg";
return false;
});
  

Вы знаете, сколько существует изображений? Если это так, просто проверьте, не превысит ли новое число общее количество ( if newNumber ... ) и ничего не делайте (т. Е. пропустите ту часть, где вы меняете testImage.src .

Например, вам нужно иметь общее количество в переменной totalImages , тогда вы могли бы сделать:

 $("#prev, #next").click(function() { 
  var currentNumber = parseInt($("#image1").attr("src").split('gallery/')[1]); // get the   number
  var newNumber = ($(this).attr("id")=="next")?currentNumber 1:currentNumber-1;
  var totalImages = // get the number of total images here
  if ((newNumber > totalImages) || (newNumber <= 0)) {
        return false; // just do nothing
  }

  // here comes the rest of your code
});
  

Обратите внимание, что я также добавил возможность того, что ваш номер станет меньше 0 или 0, в зависимости от того, есть ли у вас изображение с именем 0 . Если да, вы можете изменить <= на < , иначе 0 изображение отображаться не будет.

Чтобы вставить это число в свой код Javascript, вы могли бы либо отрендерить код с помощью PHP и вставить его в свой скрипт с помощью <?php echo $total; ?> , либо извлечь его из другого элемента HTML-страницы, как вы сделали с currentNumber .