Question

简而言之，我想根据类别使用单选按钮对已经存在的图像进行排序 - 我尝试通过向特殊类别图像添加不同类别的图像（我不想使用任何其他插件）像可排序等）。 #inside是单选按钮ID，我有这段代码：

$(function(){
    var allImage = $('img.group1');
    var insideImage = $('img.group1').hasClass('insideThis');
    $('#inside').on('click' , function() {
        if ($(this).is(':checked')) {
            $(allImage).fadeOut('500');
            $(insideImage).fadeIn('500');
            }
        else {
        }
    });
});

我的html如下所示：

<ul class="thumbnails image-sort">
          <li class="col-md-2 list-inline">
            <a class="thumbnail" rel="lightbox[group]" href="img/pics/1.jpg"><img class="group1 insideThis" src="images/10.png" title="Image Title" /></a>
          </li> <!--end thumb -->  
          <li class="col-md-2 list-inline">
            <a class="thumbnail" rel="lightbox[group]" href="images/10.jpg"><img class="group1 insideThis" src="images/10.png" title="Image Title" /></a>
          </li> <!--end thumb -->
          <li class="col-md-2 list-inline">
            <a class="thumbnail" rel="lightbox[group]" href="img/pics/1.jpg"><img class="group1" src="images/10.png" title="Image Title" /></a>
          </li> <!--end thumb -->
          <li class="col-md-2 list-inline">
            <a class="thumbnail" rel="lightbox[group]" href="img/pics/1.jpg"><img class="group1" src="images/10.jpg" title="Image Title" /></a>
          </li> <!--end thumb -->   
        </ul><!--end thumbnails -->

结果是点击收音机时所有图片都是fadeOut，但是这张图片insideThis并不想显示。我尝试使用addClass hidden和removeClass Hidden等，但没有结果。有什么建议吗？

Answer 1

jQuery＆＃39; s hasClass()返回一个布尔值，而不是元素，你可能想要选择具有类的元素

var insideImage = $('img.group1.insideThis');

或者您已经拥有了一组图像，您可以在不进行其他DOM查找的情况下对其进行过滤

var allImage = $('img.group1');
var insideImage = allImage.filter('.insideThis');

使用radio和jQuery对图像进行排序

1 个答案: