2013-07-14 1 views
1

등급 시스템을 만들고 있는데, 각 단어를 클릭 할 때 전체 투명성을 부여하기를 원합니다. 또한 각 단어 위로 마우스를 가져 가면 이전 단어도 강조 표시됩니다.왜 mouseenter/mouseleave가 .click 이벤트에 영향을 줍니까?

기본적으로 내가 가진 유일한 문제는 사실 .click(); 이벤트가 작동하지 않습니다. 그것은 당신이 위의 모든 코드를 꺼내 경우 작동 :

// This isn't working: 
$("#poor").click(function() { 
    $(this).css("opacity", "1"); 
}); 

$("#good").click(function() { 
    $(this).css("opacity", "1"); 
}); 

$("#great").click(function() { 
    $(this).css("opacity", "1"); 
}); 

jsFiddle 데모을 :: http://jsfiddle.net/MatthewKosloski/rjFpn/1/ 당신이 "이"로 이벤트를 참조하는 이벤트를 처리하는 지금

+1

클릭 한 후 마우스를 놓은 후에도 여전히 마우스가 남아있는 이벤트가 트리거됩니다. 당신은 그것을 클릭 한 후에 일종의 플래그를 설정해야합니다, 아마도 엘의 데이터 속성 일 것입니다. 그런 다음 mouseleave/mouseenter에서 attr을 확인하십시오. –

답변

1

.

$("#poor").click(function (event) { 
    var el = event.target || event.srcElement; 
    $(el).css("opacity", "1"); 
}); 

편집 :

는 다음과 같이하도록 코드를 변경

내가 잘못이었다 밝혀, 마우스를 할 때 요소의 CSS 속성을 변경두고 있기 때문에 이유는, 사람 후 당신은 사용자가 요소를 클릭했을 때의 플래그를 설정하면 클릭했는지, 당신은

을 발사에서하는 MouseLeave 이벤트를 방지 할 수있는 여기를 클릭하십시오 제대로 opacit를 설정하는 JSFiddle http://jsfiddle.net/jDjSu/

+0

팁을 주셔서 감사합니다. – Matthew

+0

어떤 종류의 플래그입니까? 나는 JS에 익숙하지 않다. 묻는 것에 대해 미안하다. 나는 네가 무엇을 의미하는지 알 것 같아. – Matthew

+0

JSFiddle을 확인하십시오. – fm2munsh

2

입니다 y를 1로 설정하면 mouseleave가 다시 불투명도를 0.50로 설정합니다.

그래서 mouseleave에서 클릭을 취소합니다.

+1

LOL 얼마나 어리석은 .. .. 고마워요! 나는 그것을 고쳐 줄 것이다. ;) – Matthew

관련 문제