청취자 클래스를 제거해도 Jquery JavaScript와 연결된 사운드 이벤트가 중지되지 않습니다.

Question

이미지 위로 마우스를 가져 가면 사운드가 재생됩니다 (이미 정상적으로 작동 중입니다). 원하는 경우이 버튼을 끄려면이 버튼을 포함하고 싶습니다. 불행히도 나는 그것을 작동하게 만들지 못했다.

내 현재 코드는 같이 간다 : 트리거의 사운드

//a bunch of code to generate the audio that ends on 

var mouseoversound = createsoundbite('mysound.mp3') 

를 만들기위한

그것을

$(".play").mouseover(function() { 
     mouseoversound.play(); 
    }); 

리스너 요소

,

<%= image_tag "image.png", class:'logo-image play' %> 

나는 이벤트를 '수신 대기'하는 클래스를 제거하는 것이 가장 간단한 해결책이라고 생각했습니다. 요소 리스너에서 '.play'), 내가 피곤 :

$(".sound").click(function(){ 
    $(".logo-image").removeClass("play"); 
    }); 

//.sound is the class of the button that's intended to block it. 

후자 스크립트가 성공적으로 클래스 '놀이'를 제거 않지만 소리가 나는 이미지 위에 마우스를 올려마다 계속 재생. 내가 뭘 놓치고 있니? 소리가 그냥 멈추지 않아야하지 않니?

다른 해결책이 있습니까? 이벤트 처리기가 요소에 결합되어 있기 때문에

건배

Answer 1

문제입니다. 이벤트가 바인드 된 후 클래스를 제거해도 해당 바인딩에는 영향을주지 않습니다. 이벤트 처리기에 영향을하려면 다음과 같이 off()를 호출 할 수

$(".sound").click(function(){ 
    $(".logo-image").off('mouseover'); 
}); 

을 양자 택일로, 당신은 클래스에 따라 사운드 기능을 전환하려는 경우, 당신은 현재의 논리를 유지하고 요소가 여전히이 있는지 확인하실 수 있습니다 mouseover 핸들러의 클래스 :

$(".logo-image").mouseover(function() { 
    if ($(this).hasClass('play') { 
     mouseoversound.play(); 
    } 
}); 

$(".sound").click(function(){ 
    $(".logo-image").toggleClass("play"); 
});