2011-04-25 3 views
3

어떤 클릭 블록 요소 내부의 텍스트 색상을 변경, 나는사용 jQuery를이 간단해야 내가 뭔가 도움이 필요

: 나는이 HTML을 희망 요소를 클릭 할 때마다 선택된 텍스트가 빨간색으로 바뀝니다. 이제는 다른 요소들도있을 수 있으므로이를 명심하십시오. 또한 선택한 요소 만 색상을 변경해야합니다. 여기 예를 들어

는 DIV 요소에 대해 정확히 내가 필요하지만 할 것입니다 몇 가지 간단한 코드입니다

HTML의 모든 요소에 대해 동일한 기능을하는 가장 간단한 코드는 무엇
$('div').click(function() { 
    $(this).css({'color':'red'}); 
    }); 

.

감사합니다.

$('*').click(function(e) { 
    $(this).css('color', 'red'); 
    e.stopPropagation(); 
}); 

에 대해 나는 "인 stopPropagation()"모든 인해 이벤트가 버블 링에 빨간색으로하지 않습니다 있는지 확인하기 위해 전화를 포함하는 방법

+0

답변이 있어야합니다. 아래에서 가장 잘 생각하는 해결책 중 하나를 받아 들여야합니다. – Tareq

답변

7

CSS :

.highlight 
{ 
    color: #f00; 
} 

자바 스크립트 : 첫 번째 호출에서 클래스를 제거

$('*').click(function(e) { 
    $('*').removeClass('highlight'); 
    $(this).addClass('highlight'); 
    e.stopPropagation(); 
}); 

만일 그것이 이미 밝혀 졌다면 모든 것을. 이렇게하면 한 번에 하나의 항목 만 강조 표시됩니다.

+0

Geoff에게 감사드립니다. 이것은 완벽하게 작동합니다! – Klikerko

8

.

물론이 효과를 일부 컨테이너에서 사용하려는 경우 컨테이너의 모든 요소를 ​​가져 오기 위해 초기 선택기를 "*"(DOM의 모든 요소)에서 "#containerId *"와 같은 것으로 변경할 수 있습니다. .

편집 나는 제프의 대답 @ 좋아 —는 - 그것은 :-) 많은 classier의

+0

Thanks Pointy, stopPropagation()은 내 코드에서 누락 된 링크입니다. :) – Klikerko

+0

+1을 사용하는 대신 콘테이너에 제약을 적용하기 위해 +2 * +1 * – Geoff

+0

+1을 사용하는 것이 좋습니다. – Klikerko