programing

jQuery에서 프로그래밍과 사용자 클릭을 구분하려면 어떻게 해야 합니까?

megabox 2023. 9. 26. 22:15
반응형

jQuery에서 프로그래밍과 사용자 클릭을 구분하려면 어떻게 해야 합니까?

클릭 처리기를 정의했다고 가정합니다.

$("#foo").click(function(e){

});

이벤트가 프로그래밍 방식으로 실행되었는지 사용자에 의해 실행되었는지 기능 핸들러 내에서 어떻게 알 수 있습니까?

당신은 이벤트 객체를 볼 수 있습니다.e. 이벤트가 실제 클릭으로 트리거된 경우 다음과 같은 것이 발생합니다.clientX,clientY,pageX,pageY, 안에 있는 등e숫자는 숫자가 됩니다. 이 숫자들은 클릭이 트리거될 때 마우스 위치와 관련이 있지만 키보드를 통해 클릭이 시작된 경우에도 표시될 수 있습니다.이벤트가 발생한 경우$x.click()그러면 일반적인 위치 값을 가질 수 없습니다.e. 당신은 또한 사건이 발생했다면 그곳에 있어서는 안 되는 부동산을 볼 수도 있습니다.$x.click().

아마 이런 거겠지.

$("#foo").click(function(e){
    if(e.hasOwnProperty('originalEvent'))
        // Probably a real click.
    else
        // Probably a fake click.
});

그리고 여기 함께 놀 작은 샌드박스가 있습니다: http://jsfiddle.net/UtzND/

jQuery 트리거 매뉴얼에 명시된 대로 추가 파라미터를 사용할 수 있습니다.

$("#foo").click(function(e, from){
    if (from == null)
        from = 'User';
    // rest of your code
});

$('#foo').trigger('click', ['Trigger']);

이미 대답한 질문이 하나 더 있습니다.

클릭()이 마우스 클릭인지 또는 일부 코드에 의해 트리거되는지 감지하는 방법은 무엇입니까?

사용.which이벤트 개체의 속성입니다.그럴 것 같네요.undefined코드 triggered 이벤트의 경우

$("#someElem").click(function(e) {
    if (e.which) {
        // Actually clicked
    } else {
        // Triggered by code
    }
});

JsFiddle 예제 - http://jsfiddle.net/interdream/frw8j/

도움이 되길 바랍니다!

저는 위의 모든 해결책을 시도해 보았습니다.제 경우에는 아무것도 효과가 없었습니다.아래의 해결책이 저에게 효과가 있었습니다.당신에게도 도움이 되기를 바랍니다.

$(document).ready(function(){
  //calling click event programmatically
    $("#chk1").trigger("click");
});

$(document).on('click','input[type=checkbox]',function(e) {
		if(e.originalEvent.isTrusted==true){
			alert("human click");
		}
		else{
			alert("programmatically click");
		}
    
    });
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js">
</script>

<input type="checkbox" id="chk1" name="chk1" >Chk1</input>
<input type="checkbox" id="chk2" name="chk2" >Chk2</input>
<input type="checkbox" id="chk3" name="chk3" >Chk3</input>

DOM 수준 3은 event.isTrusted를 지정합니다.현재 IE9+ 및 Firefox에서만 지원됩니다(테스트 기준).또한 일부 브라우저에서 이 기능이 무시될 수 있으며 아직 100% 신뢰할 수 있는 준비가 되어 있지 않다는 것을(불행하게도) 읽었습니다.

이것은 IE와 파이어폭스에서 작동하는 @mu의 fiddle의 변형된 버전입니다.

Vanilajs 솔루션:

document.querySelector('button').addEventListener('click', function (e){
    if(e.isTrusted){
        // real click.
    }else{
        // programmatic click
    }
});

지적 토론에 참여하지 않을 것이고, 내가 필터링할 수 있었던 코드..click()그리고..trigger('click')아..

$(document).on('click touchstart', '#my_target', function(e) {
    if (e.pageX && e.pageY) { // To check if it is not triggered by .click() or .trigger('click')
        //Then code goes here
    }
});

언급URL : https://stackoverflow.com/questions/6674669/in-jquery-how-can-i-tell-between-a-programmatic-and-user-click

반응형