jQuery로 요소 클래스 토글?

는이 코드jQuery로 요소 클래스 토글?

$("#click").bind('mousedown mouseup mouseover', function(e) { 
    if(e.type === 'mouseover'){ 
     $(this).addClass('open'); //works! 
    } 
    if(e.type === 'mousedown'){ 
     $(this).removeClass().addClass('closed'); //works! 
    } 
    if(e.type === 'mouseup'){ 
     $(this).removeClass().addClass('open'); 
     // The above line doesn't work :(
    } 
});

Demo here이 코드는 마우스 오버, mousedown 작동 및 mouseup에 대한 NOT와 함께 몇 가지 문제가 있었어요. $(this).removeClass().addClass('open');의 주석 처리를 제거하면 mousedown 이벤트가 트리거링을 중지합니다.

아무도 문제가 무엇인지 알 수 있습니까?

출처

2011-09-11 Mohammad

는 고정 : http://jsfiddle.net/U544t/2/ 당신은 당신이 원하지 않는 클래스를 제거해야

, 당신이 할 클래스를 추가 할 수 있습니다. open과 closed을 가진 div로 끝났기 때문에 닫힌 아이콘 만 보여주었습니다.

출처

2011-09-11 02:48:29 Joe

클래스가 올바르게 변경 되더라도 Chrome에서는 아이콘을 변경하지 않습니다. – bcoughlan

매우 그렇습니다. 조금 더 살펴 봤는데 크롬/사파리에서 문제가되는 것 같습니다. 제안 된 수정 사항은 http://forum.jquery.com/topic/chrome-text-select-cursor-on-drag에 게시되었지만 나에게 적합하지 않습니다. 아직도 찾고 :) – Joe

http://candrews.net/sandbox/spryMap/ 여기 구현 된 것 같다 그러나 그것을 구현하는 방법을 볼 수 없어 어쩌면 당신이 :) – Mohammad

내가 뭔가를 놓치지 않는 한, 당신은 모든 추가/제거를 직접하는 대신 toggleClass()을 사용하여 좀 더 효율적으로이 작업을 수행 할 수 있습니다. 그리고 활성화 된 토글을 트리거하려면 두 클래스, 기본 상태 및 .open 클래스가 필요하지 않을 것입니다.

출처

2011-09-11 04:53:14

그 모든 사실,하지만 우리는 그것을 작동 시키려고 노력하고, 나중에 그것을 최적화 할 것이다 :) – Mohammad

jQuery로 요소 클래스 토글?

답변

관련 문제