从兄弟姐妹的jQuery中获取href属性?

时间:2017-04-21 06:53:46

标签: jquery href

我使用以下代码尝试从另一个元素获取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>

4 个答案:

答案 0 :(得分:3)

您必须使用.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>

答案 1 :(得分:1)

您可以使用href获取find('.flag-action'),因为a.linkbutton的孩子,如:

&#13;
&#13;
$('.linkbutton').bind('click', function(e) {
        e.preventDefault();
        var flagURL = $(this).find('.flag-action').attr('href');
        alert(flagURL);
    });
&#13;
<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>
&#13;
&#13;
&#13;

答案 2 :(得分:0)

而不是

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

尝试以下代码:

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

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

答案 3 :(得分:0)

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