mousedown 및 mouseup 이벤트 발생 후 클릭 이벤트가 발생하지 않습니다.

다음 동작을 원합니다.mousedown 및 mouseup 이벤트 발생 후 클릭 이벤트가 발생하지 않습니다.

"Foo"가 브라우저에 표시됩니다.
"Foo"에서 마우스 버튼을 누른 경우 "Foo"에 대해 "Bar"가 표시됩니다.
버튼을 놓으면 "Foo"가 다시 "막대"로 표시됩니다.
마지막으로 "Hello"가 경고 상자에 표시됩니다.

다음 코드를 작성했지만 마지막 단계는 발생하지 않습니다. .hide() 메서드는 onclick 이벤트가 발생하지 않도록합니다. 고칠만한 아이디어가 있습니까? 모두 mousedown 및 mouseup 이벤트가 일어날 때

<body> 
<div id="parent"> 
    <div id="foo">Foo</div> 
    <div id="bar">Bar</div> 
</div> 

<script> 
$(function(){ 
    $("#foo").show(); 
    $("#bar").hide(); 

    $("#parent").mousedown(function(){ 
     $("#foo").hide(); 
     $("#bar").show(); 
    }); 

    $("#parent").mouseup(function(){ 
     $("#foo").show(); 
     $("#bar").hide(); 
    }); 

    $("#parent").click(function(){ 
     alert("Hello"); 
    }); 
}) 
</script> 
</body>

출처

2013-10-10 user2488219

click 이벤트가 발생했을. 당신은 브라우저에 표시됩니다 mouseup

$("#parent").mouseup(function(){ 
    $("#foo").show(); 
    $("#bar").hide(); 
    alert("Hello"); 
});

출처

2013-10-10 21:32:01

그러나, 이것은 즉, 클릭 이벤트 아니더라도, 경고를 생성, 방출 후 DIV에 마우스를 드래그합니다. –

@ScottMermelstein은 Discription 경고로 인해 실제 클릭 자체가 아닌 버튼을 놓은 후에 표시되어야하므로 작동 할 수 있습니다. –

'foo는'끝에 click에 대한 코드를 추가 할 수 있습니다.

'foo'에서 마우스 버튼을 누른 경우 '막대'가 'foo'로 표시됩니다.

버튼을 놓은 경우 '막대'에 대해 'foo'가 다시 표시됩니다.

마지막으로 "Hello"가 경고 상자에 표시됩니다.

"마침내"의미하는 바가 어느 정도 있습니다. 그러나 각 mousedown 이벤트가 발생한 후 window 개체에 이벤트 수신기를 추가하는 방법은 #foo입니다. 그런 다음 콜백 함수가 끝날 때 리스너를 제거하여 '한 번만 실행'하도록 할 수 있습니다.

on_mouseup_fn = function(e) { 
    //Third condition 
    $('#foo').show(); 
    $('#bar').hide(); 
    //Fourth condition 
    alert("Hello!"); 
    $(window).off('mouseup', on_mouseup_fn); 
} 

$(document).ready(function() { 
    //First condition 
    $('#bar').hide() 
    $('#foo').on('mousedown', function(e) { 
     //Second condition 
     $(e.currentTarget).hide(); 
     $('#bar').show(); 
     //For third and fourth conditions 
     $(window).on('mouseup', on_mouseup_fn); 
    }); 
});

여기에 jsFiddle 데모가 있습니다. 내가 원하는 요소 동작을 잘못 해석했는지 알려주십시오. 당신이 사업부의 외부를 클릭하면

http://jsfiddle.net/n9GcS/8/

출처

2013-10-10 22:22:08

mousedown 및 mouseup 이벤트 발생 후 클릭 이벤트가 발생하지 않습니다.

답변

관련 문제