未定義當試圖使用addClass在$（本）錨標記

Question

function showImage(imageSrc) { 
 
      
 
      $('a.slideTabLinkBlock').removeClass('active'); 
 
      alert($(this).attr('class')); 
 
      $(this).addClass('active'); 
 

 
     }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a class="slideTabLinkBlock" onclick="showImage('<?php echo $image_src; ?>');">Link</a>

我想加個班 「活動的」 點擊一個鏈接時：

<a class="slideTabLinkBlock" onclick="showImage('<?php echo $image_src; ?>');"></a> 

function showImage(imageSrc) { 

    $('a.slideTabLinkBlock').removeClass('active'); 
    alert($(this).attr('class')); 
    $(this).addClass('active'); 

} 

當我提醒$（this）.attr（'class'）它顯示「undefined」。

爲什麼我不能使用$（this）來定位錨標籤？

如何將「活動」類添加到單擊的鏈接？

Answer 1

$(this)指的是Window對象，因此不是你期望的。 您可以將「this」傳遞給內聯JS調用中的函數，並創建參數的jQuery元素。看到的片段：

function showImage(element, imageSrc) { 
 

 
      $('a.slideTabLinkBlock').removeClass('active'); 
 
      alert($(element).attr('class')); 
 
      $(element).addClass('active'); 
 

 
     }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a class="slideTabLinkBlock" onclick="showImage(this, '<?php echo $image_src; ?>');">Link</a>

Answer 2

當使用合適的事件處理程序，則可以將您$image_src變量如在data-屬性。

$('.slideTabLinkBlock').on('click', function() { 
 

 
    var $this = $(this), 
 
    imgSrc = $this.data('imgsrc'); 
 

 
    $('a.slideTabLinkBlock').removeClass('active'); 
 
    $this.addClass('active'); 
 
    alert($(this).attr('class')); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a class="slideTabLinkBlock" data-imgsrc="<?php echo $image_src; ?>">Link</a>

Answer 3

因爲你不提供任何額外的代碼，我不知道爲什麼你在錨標記使用內聯函數。 因爲你通常可以這樣做：因爲您使用內聯事件處理程序

$('a.slideTabLinkBlock').on('click',function(){ 
    var className = $(this).attr('class'); 

    alert(className); 
})