javascript - 根据属性值隐藏div？

Question

我希望根据其属性值更改某些 div 的类（隐藏）。
这是我的代码，一旦你看到它可能会更有意义：

jQuery('#menu1').click(function() {
      jQuery([.attr('imageref')]!=[.attr('menuref')]).removeClass('pics').addClass('.pics-hidden').removeClass('pics').fadeOut(200);
      jQuery('#projectimages').masonry('reload');
       });

所以我想要的是，如果你点击#menu1它，它将使用与atrtribute.pics相同的imageref属性来删除。#menu1menuref

因此，单击等于 1 的，将隐藏也等于 1 的相关#menu1项。希望这是有道理的，任何帮助将不胜感激！menuref.picsimageref

Answer 1

您可以使用 css 选择器来完成此操作。

IE：

jQuery('#menu1').click(function()
{
  jQuery('[imgeref="menuref"]').removeClass('pics').addClass('pics-hidden');
});

编辑：

这将搜索他的属性“imageref”设置为“menuref”的所有元素，然后删除类图片并添加类图片隐藏。如果只需要 img 标签。那么你可以改变：

jQuery('[imgeref="menuref"]')

至

jQuery('img[imgeref="menuref"]')

Answer 2

您可能会使用 jQuery 过滤器功能。

http://api.jquery.com/filter/

描述：将匹配元素的集合减少为匹配选择器或通过函数测试的元素。

var menuref = ("#menu1").attr('menuref')
// Get all pics with an imageref attribute
jQuery(".pics[imageref]")
// Filter them
.filter(function(){
  return $(this).attr('imageref') != menuref; 
})
// Do what ever you want e.g. remove the pics class
.removeClass('pics')

Answer 3

您使用属性等于选择器，并将属性的值连接到选择器中menuref。

jQuery('#menu1').click(function() {
      var menu = $(this).attr('menuref');
      jQuery(".pics[imageref='" + menu + "']").toggleClass('pics pics-hidden')
                                              .fadeOut(200);
      jQuery('#projectimages').masonry('reload');
});