Question

<div class="postContent">
<div class="postMeta">
        <a class="comentsQty">
        <i class="fa fa-comments-o"></i>
        <a class="comments_number" href="">1252</a>
        </a>
</div>
<a href="#" class="postOverlayBtn"></a>
</div>

我需要点击按钮.postOverlayBtn获得1252 我的Jquery不起作用

$(document).ready(function() {
   $('.postOverlayBtn').click(function(event) {
      alert($(this).prev().find('a.comments_number').text());
});
});

Answer 1

假设更正了HTML：

<div class="postContent">
    <div class="postMeta">
        <a class="comentsQty">
            <i class="fa fa-comments-o"></i>
        </a>
        <!-- an interactive element, such as an anchor, cannot be nested inside
             another interactive element -->
        <a class="comments_number" href="">1252</a>
    </div>
    <a href="#" class="postOverlayBtn">post-overlay-button</a>
</div>

然后我建议：

// binding a click-handling anonymous function to '.postOverlayBtn' elements:
$('.postOverlayBtn').click(function(){
    // logging to the console:
    console.log($(this)
        // finding the ancestor '.postContent' element:
        .closest('.postContent')
        // finding the descendant '.comments_number' elements:
        .find('.comments_number')
        // returning the text of the (first) '.comments_number' element:
        .text());
});

JS Fiddle demo

参考文献：

Answer 2

我认为你看起来像这样：

$('.postOverlayBtn').click(function(event) {
    alert($(this).prev().children(".comments_number").text());
});

fiddle

Answer 3

 <div class="postContent">
    <div class="postMeta">
        <a class="comentsQty"> <i class="fa fa-comments-o"></i>
        </a>
        <a class="comments_number" href="">1252</a>
        </div>
    </div> 

$jq(document).ready(function() {
     $jq('.postOverlayBtn').click(function(event) {
       alert (console.log($jq(this).closest('.postContent').find('.comments_number').text()));
     })
})

警告未定义（（（（

alert($(this).prev().children(".comments_number").text());

警告无（（（<（

<div class="postContent">
    <div class="postMeta">
            <a class="comentsQty">
            <i class="fa fa-comments-o"></i>
            <a class="comments_number" href="">1252</a>
            </a>
    </div>
    <a href="javascript:void(0);" class="postOverlayBtn">click</a>
    </div> 

$jq(document).ready(function() {
   $jq('.postOverlayBtn').click(function(event) {
    alert($jq(this).prev().find('a.comments_number').text());
   })
})

警告无

http://jsfiddle.net/r1xj2gvn/3/这是我的考验

Answer 4

<div class="postContent">
<div class="postMeta">
        <a class="comentsQty">
        <i class="fa fa-comments-o"></i>
        <a class="comments_number" href="">1252</a>
        </a>
<div>
    <a href="#" class="postOverlayBtn"></a>
</div>

如果div周围的按钮那么如何返回1252 ????????

Answer 5

    <div class="postContent">
    <div class="postMeta">
            <a class="comentsQty">
            <i class="fa fa-comments-o"></i>
            <a class="comments_number" href="">1252</a>
            </a>
    </div>
    <a href="javascript:void(0);" class="postOverlayBtn">click</a>
    </div> 



 $('.postOverlayBtn').click(function(event) {
         alert($(this).prev().find('a.comments_number').text());
    });

使用此功能。在你的代码中你错过了'）;'在功能的最后

点击按钮，提醒文字标签a（jquery）

5 个答案: