2013-08-17 258 views
1

我的演示代碼:http://jsfiddle.net/4w3Hy/3/不能更改標籤的顏色

我的第一個代碼添加HTML與ID的DIV:內容:

$(".text").click(function() { 
$("#Content").html($(this).next(".text1").html()); 
}); 

上的ID:內容,與新的HTML ,我嘗試運行另一個jquery功能:

$(".click").click(function() { 
$('.click').css('color',''); 
$(this).css("color", "red"); 
}); 

但不知何故,這不會工作!我做錯了什麼?看到html http://jsfiddle.net/4w3Hy/3/

回答

2

使用on將事件附加到動態附加到DOM的元素。在原始代碼中,.click元素在click事件處理程序附加到類.click的所有元素時不存在於DOM中,因此事件永遠不會綁定到新元素。

使用on()允許我們將事件處理程序附加到父節點上,例如DOM上已有的document。然後將.click元素附加到document,並在點擊時觸發傳播到document的點擊事件。一旦document收到click事件,它將確定該事件是否由具有類.click的元素觸發,如果是的話它將執行我們的附加事件。如果您熟悉已棄用的live()方法,您幾乎可以理解這個概念。

通常情況下,最好附加到更接近.click元素的靜態父級,但由於我沒有完整的HTML標記,因此我使用了document

$(".text").click(function() { 
    $("#Content").html($(this).next(".text1").html()); }); 

$(document).on("click", ".click", function() { 
    $('.click').css('color',''); 
    $(this).css("color", "red"); }); 

JS小提琴:http://jsfiddle.net/4w3Hy/5/

-1

試試這個:

DEMO

$(".text").click(function() { 
    $("#Content").html($(this).next(".text1").html()); 
    $(".click").click(function() { 

    $(this).css({color:"red" }); 
}); 
});