mousedown에서 div 이미지를 변경하고 마우스 업 때 되돌리기

Question

mousedown에서 이미지를 변경하고 mouseup시 초기 이미지로 되돌리려합니다. mousedown에서 이미지가 변경되지만 mouseup시 초기 이미지로 되돌아 가지 않습니다. 마우스 업 기능의 경고가 나타나지 않습니다 ... 무엇이 잘못 되었나요?

$(#mydivid).bind('mousedown', function() { 
     document.getElementById(mydivid).style.backgroundImage = "url(Images/new.png)"; 
     alert("mousedown"); 
    }); 



    $(#mydivid).bind('mouseup', function() { 
     document.getElementById(mydivid).style.backgroundImage = "url(Images/initial.png)"; 
alert("mouseup"); 
    }); 

내가 같은 사업부에 1 개 이상의 이벤트를 바인딩 할 때, 첫 번째 이벤트 핸들러 작동하고 나머지는 무시되는 것을 관찰 ... 어떻게 내가 모든 이벤트가 처리되는 것을 보장합니까?

Answer 1

경고를 제거해야합니다. 그게 문제의 원인입니다.

또 다른 사실은 '#mydivid'가 따옴표로 묶이지 않는다는 것입니다.

또한 jquery 1.7 이상을 사용하는 경우 '바인딩'대신 'on'을 사용하는 것이 좋습니다.

jQuery 1.7부터 .on() 메서드는 이벤트 처리기를 문서에 연결하는 데 선호되는 방법입니다. 이전 버전의 경우 .bind() 메서드는 이벤트 처리기를 요소에 직접 연결하는 데 사용됩니다.

자료 : http://api.jquery.com/bind/

JQuery와 같은 요소의 CSS 속성을 변경하는 방법이있다. 어쩌면 당신은 배경을 바꾸기 위해 그것을 고려할 수도 있습니다.

---

http://api.jquery.com/css/

하지만, 내가 말했듯이, 경고를 제거하고 그냥 잘 작동합니다. 다음 예를 참조하십시오.

http://jsfiddle.net/fS9Ct/1/