Question

我有一个wordpress页面，我在其中为每个帖子生成一个内容元素。为了测试，我创建了4个帖子，它们完美地生成了内容元素。在某些情况下，帖子中有一些图像。为此，我使用了wp滑块插件。有时滑块向左浮动，有时是向右浮动。然后我必须以另一种方式将文本浮动为滑块。

无论如何，我试图做的是将图像向左浮动，当图像向右浮动时，反之亦然。我使用jQuery来实现这一目标。但是我在挣扎。

if($('.blockcontent div').hasClass('slider-right')){
    $('.blockcontent p').removeClass('pright');
    $('.blockcontent p').addClass('pleft');
}

else if($('.blockcontent div').hasClass('slider-left')){
    $('.blockcontent p').removeClass('pleft');
    $('.blockcontent p').addClass('pright');
}

else{
    $('.blockcontent p').removeClass('pright');
    $('.blockcontent p').removeClass('pleft');
}

如果类blockcontent中的div向右浮动（class="slider-right"），则p应该有一个类将其浮动到右侧。

问题是，每个段落向一个方向浮动。原因是它将此类添加到每个段落，对吗？但是我无法仅将此类添加到此div。

如果我能做到静态不会有问题，但它必须是动态的。

有诀窍还是可以给任何人请给我一些提示？

修改

在这里，您可以看到我的HTML结构：

<div id="container">
    <div class="block">
        <h2>test1</h2>
        <br />
        <div class="blockcontent">
            <p>this is test 1</p><br />
        </div>
    </div>

    <div class="block">
        <h2>test2</h2>
        <br />
        <div class="blockcontent">
            <p>this is test 2</p><br />
            <div style="max-width: 700px;" class="metaslider metaslider-flex metaslider-21 ml-slider slider-left">
        </div>
    </div>
</div>

Answer 1

使用find()检查子元素并添加class。

类似于以下内容：

$(".blockcontent div").each(function() {
   if($(this).hasClass('slider-right')){
      $(this).parent().find("p").removeClass('pright');
      $(this).parent().find("p").addClass('pleft');
    }

  else if($(this).hasClass('slider-left')){
      $(this).parent().find("p").removeClass('pleft');
      $(this).parent().find("p").addClass('pright');
   }
  else{
       $(this).parent().find("p").removeClass('pright');
       $(this).parent().find("p").removeClass('pleft');  
   }
});

当div具有使用jQuery的特定类时，将特定类添加到段落

1 个答案: