Question

我有一组显示在多个页面上的div，它们具有以下模式：

<div class=“entry”>
  <div id=“post”>
    <div class=“text”>
      <div class=“service”></div>
      <div class=“timeline”>
        <div class=“entry-title”>
          #hashtagOne
        </div>
      </div>
    </div>
  </div>
</div>

<div class=“entry”>
  <div id=“post”>
    <div class=“text”>
      <div class=“service”></div>
      <div class=“timeline”>
        <div class=“entry-title”>
          #hashtagTwo
        </div>
      </div>
    </div>
  </div>
</div>

<div class=“entry”>
  <div id=“post”>
    <div class=“text”>
      <div class=“service”></div>
      <div class=“timeline”>
        <div class=“entry-title”>
          #hashtagThree
        </div>
      </div>
    </div>
  </div>
</div>

此论坛显示在多个页面上。

我理想的javascript / jquery解决方案是这样的：

display：none on all div class =＆＃34; entry＆＃34;
如果孩子div class =＆＃34; entry-title＆＃34;包含#something，更改父div class =＆＃34; entry＆＃34;显示：阻止

所以在第一页上我可以插入此代码只显示#hashtagOne，第二页只显示#hashtagTwo等等。

Answer 1

非常简单，只需在页面加载或您想要显示的任何事件上使用：contains（）和.closest（）：要运行的块行为。

如果你想根据不同的页面显示，我建议使用页面标题并将其设置为title =“Page One”和title =“Page 2”等，然后在文档就绪状态下进行比较，并相应地显示所需的格

jQuery(document).ready(function(){

  jQuery('div.entry').hide();
   if(jQuery(document).find("title").text() == 'Page One')
   {
       jQuery( "div.entry-title:contains('#something')" ).closest('.entry').show();
    }
    else if(jQuery(document).find("title").text() == 'Page Two')
    {
       jQuery( "div.entry-title:contains('#something Else')" ).closest('.entry').show();
    }

});

Answer 2

尝试这样的事情：

$('.entry-title').each(function(i,v){
if ($(this).text().trim().charAt(0) =="#") {
  $(this).closest('.entry').show();
}
});

https://jsfiddle.net/0ybstx9o/

Answer 3

这很好用：

$(document).ready(function(){
    $(".entry").each(function(){
        if($(this).find(".entry-title:contains('#something')").length > 0){
            $(this).css("display","block");
        } 
    });
});

Answer 4

$(".entry").find(".entry-title").text(function(key, text) {
            if (text.indexOf("#")>=0) {
                $(this).parents(".entry").hide()
            }
        })

这是工作Plunker

仅在子项包含特定字符串时显示父项

4 个答案: