未捕获的ReferenceError:.parent()或最近的()

时间:2017-07-25 13:34:19

标签: jquery

在循环中,会出现如下所示的多个div。

<div id="author-id-3" class="follow-me">                         
    <div class="author-follow">
    <a id="3" class="meta-badge"><span class="icon-close"></span> Follow</a>
    </div>          
</div>

我使用ajax更新数据库中的数据。

jQuery('.author-follow').on('click', '.meta-badge', function(e) { 
    e.preventDefault();                     

    var user_id         = $('.author-follow a.meta-badge').attr('id');  

    $.ajax( {
        ...                     
        beforeSend: function() {
            $('.follow-me .author-follow').fadeOut( 'fast' );
            $( '<div class="icon-loading"></div>' ).hide().appendTo('.follow-me').fadeIn( 'slow' );

        },
        success: function( data ) {
            $('.follow-me .icon-loading').remove();
            $('.follow-me').html( ajax_setting.ajax_follow_success ).hide().fadeIn( 'slow' );
             console.log( user_id );
        }

    } ) 

});

这会导致在页面上单击任何特定按钮时,所有follow-me div都会使用ajax_follow_success函数进行更新。虽然它应该只出现在特定的按钮区域内。

我尝试使用:

$toggle = $(this).parent().parent().find('follow-me');

beforeSend: function() {
    $toggle.fadeOut( 'fast' );
    $( '<div class="icon-loading"></div>' ).hide().appendTo($toggle).fadeIn( 'slow' );  
},

但后来我得到Uncaught ReferenceError: $toggle is not defined

我甚至尝试使用closest(),但它也不能很好地工作(很可能因为我没有正确使用它)。

beforeSend: function() {
    $(this).closest('.author-follow').fadeOut( 'fast' );    
    $( '<div class="icon-loading"></div>' ).hide().appendTo( $(this).closest('.follow-me') ).fadeIn( 'slow' );  
},

非常感谢帮助我走上正轨的任何帮助。

修改

我也从一个稍微不同的角度接近它(没有成功)。

var div_id          = $('.follow-me').attr('id');

beforeSend: function() {                
$('#' + div_id + ' .author-follow').fadeOut( 'fast' );                      
$( '<div class="icon-loading"></div>' ).hide().appendTo('#' + div_id + '').fadeIn( 'slow' );
console.log( div_id  );                         
},

1 个答案:

答案 0 :(得分:1)

您错过了班级.中的.find('follow-me')字符,这意味着它正在搜索标记follow-me而不是类。

$toggle = $(this).parent().parent().find('.follow-me');
//                                        ^ use '.follow-me'