Javascript 仅在具有指定类的图像上显示Pinterest悬停按钮

客户端希望将pinit按钮悬停在站点上的某些图像上。我查看了，只能找到如何将所有图像设置为pinit-one，并可以选择使用CSS类关闭一些图像。但这意味着网站上95%的图片必须有一个nopin类

有没有一种方法可以将一个类应用于像“pinthis”这样的图像，这样只有这些图像才有pinit按钮。我注意到你可以在Wordpress上做类似的事情，但这是一个定制的网站

提前谢谢

编辑：

这是我放在标题标签中的代码，如上面Pinterest developer链接中所述：

<script type="text/javascript" src="//assets.pinterest.com/js/pinit.js" data-pin-hover="true"></script>

---

这基本上将页面上的所有图像设置为具有pinit按钮，但我需要它们仅应用于具有特定类的图像，因此，在jQuery中执行此操作的一种方法是，默认情况下，将所有图像设置为具有以下属性：

data-pin-no-hover="true"

$(".pinit_img").removeAttr("data-pin-no-hover");

对于这一点，jQuery应该是：

 $("img").attr("data-pin-no-hover", true);

然后，在下面，您可以有一个额外的行，将要删除该属性的特定类的值更改为false：

data-pin-no-hover="true"

$(".pinit_img").removeAttr("data-pin-no-hover");

---

很抱歉回答我自己的问题，但这就是我克服问题的方法。我刚刚编写了一些JavaScript，用类“pinthis”查找图像，并将属性nopin=“true”应用于其他所有内容

我现在还不会勾选这个答案，因为可能有一种官方方法可以做到这一点，而不必将nopin=“true”应用于所有内容。。但这似乎越来越不可能了

就个人而言，这对Pinterest来说有点失望，因为你肯定应该只告诉你想要的东西，而不是浪费时间重复所有不想要的东西。对我来说，这似乎是一种浪费

总之，我就是这样做的：

<script type="text/javascript">
    $(document).ready(function(){
        $("img").each(function(){
            if(!$(this).hasClass("pinthis")){
                $(this).attr("nopin", "true");
            }
        });
    });
</script>

$（文档）.ready（函数（）{
$（“img”）。每个（函数（）{
if（！$（this.hasClass（“pinthis”））{
$（this.attr（“nopin”，“true”）；
}
});
});

使用jQuery的又一个解决方案：

$('img').filter(function() {
  if ($(this).closest('.main-image').length === 0) {
    $(this).attr('data-pin-no-hover', true);
  }
});

---

我认为这是可能的。但是为了让我们能够帮助你，请分享你的一些代码。我已经更新了我的答案。这是一个好主意，很有意义。但由于某种原因进行测试后，不管怎样，数据pin no hover=“false”似乎仍然是=“true”。它似乎有数据针没有悬停等于任何东西使它变得多么奇怪。Pinterest当然没有创建最直观的外接程序！这就是我所想的：p虽然，你让我思考并改变了你所说的“$”（“.pinit_img”）.attr（“数据针无悬停”，false）；“到“$”（“.pinit_img”）。removeAttr（“数据针无悬停”）；”将解决问题，并且代码比我在回答中使用的更少。因此，如果你在回答中改变了这一点，我将为你设置正确的答案