隐藏子元素，如果它们包含href ==＃

Question

如果#wrapper div.part属性等于a href，我如何隐藏每个#？我尝试过这个并没有用：

$("document").ready(function() {
  $('#wrapper > div.part a').each(function() {
    if (this == "#") {
      $(this).hide();
    } else {
      $(this).show();
    };
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="wrapper">
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 1</a>
  </div>
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 2</a>
  </div>
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 3</a>
  </div>
</div>

我是jQuery的新手，很抱歉，如果它是基本的。

Answer 1

要执行此操作，您可以按href选择closest()元素，然后获取.part父hide()和$('#wrapper .part a[href="#"]').closest('.part').hide(); 。试试这个：

$('#wrapper .part a[href="#"]').closest('.part').hide();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="wrapper">
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 1</a>
  </div>
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 2</a>
  </div>
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 3</a>
  </div>
  <div class="part">
    <p>Some text here...</p>
    <a href="somepage.html">Link 4</a>
  </div>
</div>

$('#wrapper .part:has(a[href="#"])').hide();

或者更简洁，感谢@ T.J。克劳德：

<%= simple_form_for :post do |f| %>
  <%= f.error_notification %>
  <%= f.input :title %>
  <%= f.input :body %>
  <%= f.button :submit %>
<% end %>

Answer 2

以下是您要找的内容：

＆＃13;

＆＃13;

$("document").ready(function () {
    $('#wrapper > div.part a').each(function() {
            if ($(this).attr('href') == "#") {
                $(this).hide();
            }
            else {
                $(this).show();
            };
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="wrapper">
    <div class="part">
        <p>Some text here...</p>
        <a href="#">Link 1</a>
    </div>
    <div class="part">
        <p>Some text here...</p>
        <a href="#">Link 2</a>
    </div>
    <div class="part">
        <p>Some text here...</p>
        <a href="">Link 3</a>
    </div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 3

根据我的建议，只需在css

中使用即可

＆＃13;

＆＃13;

#wrapper .part a[href='#']{
display:none;
}

＆＃13;

<div id="wrapper">
      <div class="part">
        <p>Some text here...</p>
        <a href="#">Link 1</a>
      </div>
      <div class="part">
        <p>Some text here...</p>
        <a href="#">Link 2</a>
      </div>
      <div class="part">
        <p>Some text here...</p>
        <a href="#">Link 3</a>
      </div>
    </div>

＆＃13;

＆＃13;

＆＃13;

适用于javascript

您可以像$(this).attr('href')

一样使用

＆＃13;

＆＃13;

$("document").ready(function() {
  $('#wrapper > div.part a').each(function() {
    if ($(this).attr('href') == "#") {
      $(this).hide();
    } else {
      $(this).show();
    };
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="wrapper">
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 1</a>
  </div>
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 2</a>
  </div>
  <div class="part">
    <p>Some text here...</p>
    <a href="#">Link 3</a>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 4

＆＃13;

＆＃13;

$("document").ready(function () {
    $('#wrapper > div.part a').filter(function() {
           return $(this).attr('href') == "#"
    }).parent('div.part').hide()
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="wrapper">
    <div class="part">
        <p>Some text here...</p>
        <a href="#">Link 1</a>
    </div>
    <div class="part">
        <p>Some text here...</p>
        <a href="#">Link 2</a>
    </div>
    <div class="part">
        <p>Some text here...</p>
        <a href="#1">Link 3</a>
    </div>
</div>

＆＃13;

＆＃13;

＆＃13;

1. 使用.filter()
2. 使用href ==＃
返回匹配a
3. 使用课程部分
隐藏其父级

Answer 5

带有google链接的示例...

使用attr（）函数，您可以读取元素的特定属性。 每个函数还提供当前元素作为函数的参数。你应该避免在嵌套函数中使用“this”，因为根据上下文它可能会有所不同。

$('#wrapper > div.part a').each(function(index,element) {
            if ($(element).attr("href") == "#") {
                $(element).hide();
            }
            else {
                $(element).show();
            };
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="wrapper">
    <div class="part">
        <p>Some text here...</p>
        <a href="#">Link 1</a>
    </div>
    <div class="part">
        <p>Some text here...</p>
        <a href="http://google.de">Link to google</a>
    </div>
    <div class="part">
        <p>Some text here...</p>
        <a href="#">Link 3</a>
    </div>
</div>