DIV CSS 佈局教程網

因為我不知道怎麼描述這個問題，故標題起的這麼坑爹

主要過程是這樣的，今天我寫一個類似於百度知道那樣有提問答案的頁面，所有的數據都是頁面第一次加載時通過ajax得到的
 
希望實現的效果是提問者可以通過店家每個答案後面的星星符號選擇采納此答案，被采納的答案星星圖標會變成全黑的。

開始我是這樣寫的
. 代碼如下:
$('.choose_right_answer').bind('click',function(){
if(currentUser==questioner) {
if ($(this).attr("src") == "img/star_fav_empty.png")
$(this).attr("src", "img/star_fav.png");
else
$(this).attr("src", "img/star_fav_empty.png");
}
});

.choose_right_answer是每個星星class名

運行之後點擊星星沒有反應

於是我在上面所示代碼段之前加上了一個alert("test")

此時加載頁面後彈出對話框test之後，星星圖標上綁定的事件可以正常執行。

上網搜了一通答案，得到的結果是由於所有的這些答案的節點都是動態生成的，因此可能在這些節點還沒有執行完時，就執行了事件綁定，以至於並沒有真正將事件綁定到生成的這些答案的節點。

而加上alert之後，可以明顯看到，alert語句在所有數據得到後才執行，確保了事件綁定在數據加載完之後執行，因此事件成功綁定到了各個回答上。
http://img.blog.csdn.net/20140531202827265
解決方法，使用jQuery中的on來綁定事件
. 代碼如下:
$("#answer_wrap").on('click','.choose_right_answer',function(){
if(currentUser==questioner) {
if ($(this).attr("src") == "img/star_fav_empty.png")
$(this).attr("src", "img/star_fav.png");
else
$(this).attr("src", "img/star_fav_empty.png");
}
});

answer_wrap是所有回答所在塊的id

所有在這個塊裡class為choose_right_answer的元素如果發生點擊則事件冒泡到answer_wrap，執行對應函數，其余在這個塊中的元素發生點擊事件則忽略

這樣就可以解決動態加載數據中事件綁定的問題