从兄弟姐妹的 child jQuery 获取 href 属性？

Question

我正在使用以下代码尝试从另一个元素获取 href 数据，它一直返回 "undefined" 我做错了什么？

$('.linkbutton').bind('click', function(e) {
        e.preventDefault();
        var flagURL = $(this).siblings().next('.flag-action').attr('href');
        console.log(flagURL);
    });
<div class="linkbutton">
<h4 class="quoteflag">
    <a href="/demo/url/here" title=" " class="flag-action">
    </a>
</h4>

Answer 1

而不是

var flagURL = $(this).siblings().next('.flag-action').attr('href');

试试下面的代码：

var flagURL = $(this).siblings().find('.flag-action').attr('href');

因为 next() 选择器将 return 你是下一个兄弟姐妹。但是你需要下一个兄弟姐妹的child。 Find() 选择器将为您提供特定元素的所有后代。在你的情况下，你也可以使用 children() 选择器而不是 find() 因为你试图找到 H4 元素的直接 child。

Answer 2

您必须使用 .find() 而不是 .next()，因为 flag-action 是一个子元素，而不是 quoteflag 旁边的元素

$('.linkbutton').bind('click', function(e) {
  e.preventDefault();
  var flagURL = $(this).siblings().find(".flag-action").attr("href");
  console.log(flagURL);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="linkbutton">click</div>
<h4 class="quoteflag">
  <a href="/demo/url/here" title=" " class="flag-action">
  </a>
</h4>

Answer 3

您可以使用 find('.flag-action') 获得 href，因为 a 是 .linkbutton 的子代，例如：

$('.linkbutton').bind('click', function(e) {
        e.preventDefault();
        var flagURL = $(this).find('.flag-action').attr('href');
        alert(flagURL);
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="linkbutton">Click here
<h4 class="quoteflagdiv">
    <a href="/demo/url/here" title=" " class="flag-action">
    </a>
</h4>

Answer 4

$('.linkbutton').bind('click', function(e) {
        e.preventDefault();
        
        var flagURL = $(this).siblings().find('.flag-action').attr('href');
        console.log(flagURL);
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="linkbutton">linkbutton div</div>
<h4 class="quoteflag">
    <a href="/demo/url/here" title=" " class="flag-action">
    </a>
</h4>

从兄弟姐妹的 child jQuery 获取 href 属性？

Get href attribute from sibling's child jQuery?

jquery

href