2013-08-17 2 views
1

내 데모 코드 : http://jsfiddle.net/4w3Hy/3/는 태그의 색상을 변경할 수 없습니다

내 첫 번째 코드는 ID를 가진 DIV에 HTML을 추가 : 내용 : 아이디에

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

: 콘텐츠, 새로운 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과 같은 상위 항목에 이벤트 처리기를 연결할 수 있습니다. 요소가 document에 추가되고 클릭하면 document으로 전파되는 클릭 이벤트가 발생합니다. documentclick 이벤트를 받으면 .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" }); 
}); 
}); 
관련 문제