Question

我正在尝试显示从下面的列表中选择的图像。我在这里给出了演示代码

HTML：

<div class="full">
{!! HTML::image('assets/images/men1.jpg', 'a picture', array('class' => 'img-responsive')) !!}
<a href="#" class="details"><i class="pe-7s-search"></i></a>
</div>
<div class="previews">
    <div class="box-content">
        <div>
            {!! HTML::image('assets/images/men1.jpg', 'a picture', array('data-full'=>'assets/images/men1.jpg','class'=>'selected'))!!}
        </div>
        <div>
            {!! HTML::image('assets/images/men2.jpg', 'a picture', array('data-full'=>'assets/images/men2.jpg'))!!}
        </div>                            
       </div>
            <div class="nav">
              <span class="prev"><i class="fa fa-angle-left"></i></span>
              <span class="next"><i class="fa fa-angle-right"></i></span>
            </div>
</div>

我希望当我选择第二张图像时，第二张图像上的类变为'class'=＆gt;'selected'就像第一张图像一样，在第一张图像中我要显示第二张图像。即使点击下一个/上一个链接，我也想显示所选图像。

我该怎么做？任何帮助将不胜感激。

Answer 1

我不是百分百确定，但这可行。请尝试发布反馈信息。

var $selected = $('.selected'); // To get the selected element
var $container = $('.box-content'); // to get the parent of all div which has the images.
if($container.index($selected) == $container.length) {
    // this means the selected element is the last one.
    $container.find('img').removeClass('selected').first().addClass('selected');
} else {
    $container.find('img').removeClass('selected').next().addClass('selected');
}

Laravel 5.1-不显示从列表

1 个答案: