簡單的jquery ajax append（）不工作

Question

我已經正確地引用了jquery 2.1版（最新的）。但是當我點擊「關於」時沒有任何反應。我正在python（Flask）本地服務器上運行代碼。我究竟做錯了什麼？

<div id="main"> 
    <div class="inner"> 
    <ul class="nav"> 
     <li class="active"><a href="/">Home</a></li> 
     <li><a href="" id="about">About</a></li> 
    </ul> 
    </div> 
</div> 

<script> 
    $(document).ready(function() { 
    $('#about').click(function() { 
     $('#main').append("testing"); 
    }); 
    }); 
</script> 

編輯：改變#about到href='#'，什麼都沒有改變

Answer 1

替換：

<li><a href="" id="about">About</a></li> 

與

<li><a href="#" id="about">About</a></li> 

結帳這個​​。

Answer 2

現實情況是，頁面將被刷新，因爲你離開了鏈接href爲空，這意味着它指向頁面本身。

解決方案1：

<li><a href="#" id="about">About</a></li> 

解決方案2：停止超鏈接。

$(document).ready(function() { 
$('#about').click(function() { 
    $('#main').append("testing"); 
    return false; 
}); 

}）;

Answer 3

您需要防止鏈路的默認操作...

$('#about').click(function(e) { 
    e.preventDefault(); 
    $('#main').append("testing"); 
});