使用jQuery $（this）.addClass不工作，簡單的代碼不工作

Question

這個簡單的代碼不工作，只是試圖添加一個類，一旦點擊。

$('a').click(function(){  
     //alert('on'); WORKING 
     $(this).addClass('on'); 
    }) 

的HTML僅僅是..

<ul> 
<li><a href="">List Item 1</li> 
<li><a href="">List Item 2</li> 
<li><a href="">List Item 3</li> 
<li><a href="">List Item 4</li>       
    </ul> 

Answer 1

你沒有永遠閉上你的<a>，但它以其他方式爲我工作。

http://jsfiddle.net/L3nyE/

<ul> 
    <li><a href="#">List Item 1</a></li> 
    <li><a href="#">List Item 2</a></li> 
    <li><a href="#">List Item 3</a></li> 
    <li><a href="#">List Item 4</a></li>       
</ul> 

CSS：

.on { background-color:red; } 

的jQuery：

$('a').click(function(){  
     //alert('on'); WORKING 
     $(this).addClass('on'); 
}); 

Answer 2

阻止默認行爲

$('a').click(function(event){ 
    event.preventDefault();  
    $(this).addClass('on'); 
}); 

Answer 3

適用於我，只要您將鏈接的目標更改爲"#"即可。 （或者return false從點擊處理。）

http://jsfiddle.net/jaNCq/1/

你永遠閉上你的<a>的但Firefox是足夠聰明，關閉它們。不能說其他瀏覽器。

Answer 4

你的代碼工作正常，請檢查以便在加載並準備好dom時加載代碼。 Working example

$(document).ready(function(){ 
    $('a').click(function(){  
     $(this).addClass('on'); 
    }); 
}); 

Answer 5

你的HTML是不正確的

<ul> 
<li><a href="#">List Item 1</a></li> 
<li><a href="#">List Item 2</a></li> 
<li><a href="#">List Item 3</a></li> 
    <li><a href="#">List Item 4</a></li>       

Demo

Answer 6

不要忘記關閉您的 「一」 的標籤。還要添加一個「;」在你的jQuery函數的末尾。

Answer 7

確保你已經引用了jquery庫並將你的代碼包裝在dom中。這對我有效。

<style> 
    .on{ 
     color:red; 
    } 
</style> 
<script> 

    $(function() { 
     $('a').click(function() { 
      //alert('on'); WORKING 
      $(this).addClass('on'); 
     }) 
    }); 
</script>