Question

您好，我需要为网站购物车上的图像创建下一个和上一个按钮，我为单击图像src的点击更改编写了img更改脚本，但无法创建按钮脚本

我的HTML图片块：

$('.modal-block-img-min').find('img').click(function() {
  var imgsrc = $(this).attr('src');
  $('.modal-block-img').find('img').attr('src', imgsrc);
  // imageClicked = $('.modal-block-img').find('img');
});
$('.next').click(function() {
  var imgnow = $('.modal-block-img').find('img').attr('src');
  $('.modal-block-img-min').find("img[src$='" + imgnow + "']").closest('div').next().find('img').trigger('click');
});

$('.prev').click(function() {
  var imgnow = $('.modal-block-img').find('img').attr('src');
  $('.modal-block-img-min').find("img[src$='" + imgnow + "']").closest('div').prev().find('img').trigger('click');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-md-6 image-cont">
  <div class="modal-block-img">
    <img class="img-responsive" src="./images/slider/img-1.jpg" alt="#">
  </div>
  <a class="prev" href="#">Prev</a>
  <a class="next" href="#">Next</a>
  <div class="modal-block-img-min">
    <div class="row">
      <div class="col-xs-12 col-sm-3 col-md-3"><img class="center-block" src="./images/slider/img-min-1.jpg" alt="#"></div>
      <div class="col-xs-12 col-sm-3 col-md-3"><img class="center-block" src="./images/slider/img-min-2.jpg" alt="#"></div>
      <div class="col-xs-12 col-sm-3 col-md-3"><img class="center-block" src="./images/slider/img-min-3.jpg" alt="#"></div>
      <div class="col-xs-12 col-sm-3 col-md-3"><img class="center-block" src="./images/slider/img-min-4.jpg" alt="#"></div>
    </div>
    <div class="row">
      <div class="col-xs-12 col-sm-3 col-md-3"><img class="center-block" src="./images/slider/img-min-1.jpg" alt="#"></div>
      <div class="col-xs-12 col-sm-3 col-md-3"><img class="center-block" src="./images/slider/img-min-2.jpg" alt="#"></div>
      <div class="col-xs-12 col-sm-3 col-md-3"><img class="center-block" src="./images/slider/img-min-3.jpg" alt="#"></div>
      <div class="col-xs-12 col-sm-3 col-md-3"><img class="center-block" src="./images/slider/img-min-4.jpg" alt="#"></div>
    </div>
  </div>
</div>

但是下一个和上一个的js无法正常工作

单击下一个或上一个图像的jQuery图像更改src

0 个答案: