복붙노트

[JQUERY] 어떻게 바인드 'touchstart'모두에 이벤트가 아니라 응답을 '클릭'하는?

JQUERY

어떻게 바인드 'touchstart'모두에 이벤트가 아니라 응답을 '클릭'하는?

해결법

  1. 1.업데이트 : 대신 마우스 및 터치 사이의 선택의 "포인터"이벤트에 바인딩 할 수있는 jQuery를 포인터 이벤트 Polyfill 프로젝트를 확인하세요.

    업데이트 : 대신 마우스 및 터치 사이의 선택의 "포인터"이벤트에 바인딩 할 수있는 jQuery를 포인터 이벤트 Polyfill 프로젝트를 확인하세요.

    기능은 100ms의 당 또는 이렇게 한 번 발사 있도록 바인딩 모두에 있지만, 플래그를합니다.

    var flag = false;
$thing.bind('touchstart click', function(){
  if (!flag) {
    flag = true;
    setTimeout(function(){ flag = false; }, 100);
    // do something
  }

  return false
});

  2. 2.이것은 내가 "만들기"는 GhostClick 및 구현 FastClick을 취하는 것이 수정이다. 자신에 시도하고 당신을 위해 일했다면 알려 주시기.

    이것은 내가 "만들기"는 GhostClick 및 구현 FastClick을 취하는 것이 수정이다. 자신에 시도하고 당신을 위해 일했다면 알려 주시기.

    $(document).on('touchstart click', '.myBtn', function(event){
        if(event.handled === false) return
        event.stopPropagation();
        event.preventDefault();
        event.handled = true;

        // Do your magic here

});

  3. 3.당신이 뭔가를 시도 할 수 있습니다 :

    당신이 뭔가를 시도 할 수 있습니다 :

    var clickEventType=((document.ontouchstart!==null)?'click':'touchstart');
$("#mylink").bind(clickEventType, myClickHandler);

  4. 4.보통이는 잘 작동합니다 :

    보통이는 잘 작동합니다 :

    $('#buttonId').on('touchstart click', function(e){
    e.stopPropagation(); e.preventDefault();
    //your code here

});

  5. 5.그냥 반환 거짓을 추가; 온 ( "클릭 touchstart") 이벤트 함수의 끝에서이 문제를 해결할 수 있습니다.

    그냥 반환 거짓을 추가; 온 ( "클릭 touchstart") 이벤트 함수의 끝에서이 문제를 해결할 수 있습니다.

    $(this).on("click touchstart", function() {
  // Do things
  return false;
});

    CSTE 연구진에 jQuery를 문서에서 ()

  6. 6.나는 비슷한 일을했다. 여기에 나를 위해 일한 무엇의 단순화 된 버전입니다. 터치 이벤트가 감지되면 바인딩 클릭을 제거합니다.

    나는 비슷한 일을했다. 여기에 나를 위해 일한 무엇의 단순화 된 버전입니다. 터치 이벤트가 감지되면 바인딩 클릭을 제거합니다.

    $thing.on('touchstart click', function(event){
  if (event.type == "touchstart")
    $(this).off('click');

  //your code here
});

    내가 바인딩 클릭을 제거하고 요소에 대한 기본 동작을 방지 클릭 이벤트를 바인딩했다, 그래서 내 경우에는 클릭 이벤트는 요소에 결합했다.

    $thing.on('touchstart click', function(event){
  if (event.type == "touchstart")
    $(this).off('click').on('click', function(e){ e.preventDefault(); });

  //your code here
});

  7. 7.나는 다음과 같은 방법으로 성공했다.

    나는 다음과 같은 방법으로 성공했다.

    쉬워요...

    $(this).on('touchstart click', function(e){
  e.preventDefault();
  //do your stuff here
});

  8. 8.나는 가장 좋은 방법은 사용 지금 생각 :

    나는 가장 좋은 방법은 사용 지금 생각 :

    $('#object').on('touchend mouseup', function () { });

    예

    $ ( '# 클릭'() '와 mouseUp', 기능 () {경고 () '이벤트가 감지';})에.; $ ( '# 터치') ( 'touchend', 기능 () {경고 () '이벤트가 감지';})에.; <스크립트 SRC = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> 나 클릭

    나 터치

    EDIT (2017)

    2017 년 현재로, 브라우저는 크롬으로 시작을 클릭 요청에 탭 이벤트에 의해 발생하는 지연을 제거함으로써 모두 마우스와 터치 호환성 ( '클릭') 클릭 이벤트 CSTE 연구진을 향한 단계를하고 있습니다.

    결론이 리드는 클릭 이벤트를 사용하여 다시 되 돌리는 것은 전진 가장 간단한 해결책이 될 것이다.

    난 아직이 실제 있는지 확인하기 위해 테스트 어떤 크로스 브라우저를하지 않은.

  9. 9.일반적으로 당신은 기본 터치 및 비 터치 (클릭) API를 혼합하고 싶지 않아요. 당신은 터치의 세계로 이동하면 그것은 쉽게 터치 관련 기능 만 처리합니다. 다음은 사용자가 원하는 것을 할 것입니다 일부 의사 코드입니다.

    일반적으로 당신은 기본 터치 및 비 터치 (클릭) API를 혼합하고 싶지 않아요. 당신은 터치의 세계로 이동하면 그것은 쉽게 터치 관련 기능 만 처리합니다. 다음은 사용자가 원하는 것을 할 것입니다 일부 의사 코드입니다.

    당신이하는 TouchMove 이벤트에 연결하고 위치를 추적하는 경우에 당신은 몸짓과 이것 저것을 감지 할 doTouchLogic 기능에 더 많은 항목을 추가 할 수 있습니다.

    var touchStartTime;
var touchStartLocation;
var touchEndTime;
var touchEndLocation;

$thing.bind('touchstart'), function() {
     var d = new Date();
     touchStartTime = d.getTime();
     touchStartLocation = mouse.location(x,y);
});

$thing.bind('touchend'), function() {
     var d = new Date();
     touchEndTime= d.getTime();
     touchEndLocation= mouse.location(x,y);
     doTouchLogic();
});

function doTouchLogic() {
     var distance = touchEndLocation - touchStartLocation;
     var duration = touchEndTime - touchStartTime;

     if (duration <= 100ms && distance <= 10px) {
          // Person tapped their finger (do click/tap stuff here)
     }
     if (duration > 100ms && distance <= 10px) {
          // Person pressed their finger (not a quick tap)
     }
     if (duration <= 100ms && distance > 10px) {
          // Person flicked their finger
     }
     if (duration > 100ms && distance > 10px) {
          // Person dragged their finger
     }
}

  10. 10.https://developers.google.com/mobile/articles/fast_buttons 구글에서 빠른 버튼과 CHOST 클릭 확인

    https://developers.google.com/mobile/articles/fast_buttons 구글에서 빠른 버튼과 CHOST 클릭 확인

  11. 11.음 ...이 모든 슈퍼 복잡합니다.

    음 ...이 모든 슈퍼 복잡합니다.

    당신이 모더 나이저이 있다면, 그것은 생각할 필요도 없다.

    ev = Modernizr.touch ? 'touchstart' : 'click';

$('#menu').on(ev, '[href="#open-menu"]', function(){
  //winning
});

  12. 12.더 나은 유지 관리를위한 또 다른 구현입니다. 그러나,이 기술은 또한 event.stopPropagation을 할 것입니다 (). 클릭은 100ms에 대한 클릭 한 것을 다른 요소에 포착되지 않습니다.

    더 나은 유지 관리를위한 또 다른 구현입니다. 그러나,이 기술은 또한 event.stopPropagation을 할 것입니다 (). 클릭은 100ms에 대한 클릭 한 것을 다른 요소에 포착되지 않습니다.

    var clickObject = {
    flag: false,
    isAlreadyClicked: function () {
        var wasClicked = clickObject.flag;
        clickObject.flag = true;
        setTimeout(function () { clickObject.flag = false; }, 100);
        return wasClicked;
    }
};

$("#myButton").bind("click touchstart", function (event) {
   if (!clickObject.isAlreadyClicked()) {
      ...
   }
}

  13. 13.그냥 문서의 목적을 위해, 여기에 내가 생각할 수있는 것이 모바일 솔루션에 바탕 화면 / 탭에서 가장 빠른 / 가장 반응 클릭에 대해 무슨 짓을했는지입니다 :

    그냥 문서의 목적을 위해, 여기에 내가 생각할 수있는 것이 모바일 솔루션에 바탕 화면 / 탭에서 가장 빠른 / 가장 반응 클릭에 대해 무슨 짓을했는지입니다 :

    나는 브라우저가 지원하는 이벤트를 터치 할 때마다, touchstart 나의 모든 클릭 이벤트를 대체, 수정 하나와 기능을 jQuery의 교체.

    $.fn.extend({ _on: (function(){ return $.fn.on; })() });
$.fn.extend({
    on: (function(){
        var isTouchSupported = 'ontouchstart' in window || window.DocumentTouch && document instanceof DocumentTouch;
        return function( types, selector, data, fn, one ) {
            if (typeof types == 'string' && isTouchSupported && !(types.match(/touch/gi))) types = types.replace(/click/gi, 'touchstart');
            return this._on( types, selector, data, fn);
        };
    }()),
});

    이상 사용 전에, 같은 동일한 것입니다 :

    $('#my-button').on('click', function(){ /* ... */ });

    사용할 수 그러나 그것은하지 않을 때 클릭 touchstart을 사용합니다. 필요한 어떤 종류의 지연 없습니다 : D

  14. 14.난 그냥 ontouchstart 이제까지 트리거 된 경우 암기 아이디어를 내놓았다. 이 경우 우리는 그것을 지원하는 장치에 있으며 온 클릭 이벤트를 무시해야합니다. ontouchstart 항상 온 클릭하기 전에 트리거해야하기 때문에,이를 사용하고 있습니다 :

    난 그냥 ontouchstart 이제까지 트리거 된 경우 암기 아이디어를 내놓았다. 이 경우 우리는 그것을 지원하는 장치에 있으며 온 클릭 이벤트를 무시해야합니다. ontouchstart 항상 온 클릭하기 전에 트리거해야하기 때문에,이를 사용하고 있습니다 :

    touchAvailable = 거짓; <= 버튼 "을 touchAvailable = 참;하여 myFunction ();"ontouchstart 의 onclick = "경우 (touchAvailable!)하여 myFunction ();"> 버튼

  15. 15.이 같은 시도 할 수 :

    이 같은 시도 할 수 :

    var clickEvent = (('ontouchstart' in document.documentElement)?'touchstart':'click');
$("#mylink").on(clickEvent, myClickHandler);

  16. 16.내 경우에는이 완벽하게 작동 :

    내 경우에는이 완벽하게 작동 :

    jQuery(document).on('mouseup keydown touchend', function (event) {
var eventType = event.type;
if (eventType == 'touchend') {
    jQuery(this).off('mouseup');
}
});

    대신 내가 클릭을 사용하는 경우, 일부 기능은 모바일 장치에서 전혀 작동하지 않았다, 같은 시간에 클릭하고 touchend를 트리거 터치 장치에, 내가 클릭으로 시도와 mouseUp 때 가장 큰 문제였다. 클릭으로 문제는 글로벌 이벤트 화재 touchend를 포함하여 이벤트의 나머지 부분입니다.

  17. 17.이 때문에 터치 이벤트 인 일을 방지, 모두 나를 위해 모바일 듣는다을했다. 바탕 화면은 마우스에 들어요.

    이 때문에 터치 이벤트 인 일을 방지, 모두 나를 위해 모바일 듣는다을했다. 바탕 화면은 마우스에 들어요.

     $btnUp.bind('touchstart mousedown',function(e){
     e.preventDefault();

     if (e.type === 'touchstart') {
         return;
     }

     var val = _step( _options.arrowStep );
               _evt('Button', [val, true]);
  });

  18. 18.이 내 기여, 그래서 나를 위해 Mottie에 의해 주어진 하나, 그냥 자신의 코드를보다 재사용 할 노력하고있어 최선의 답 것 :

    이 내 기여, 그래서 나를 위해 Mottie에 의해 주어진 하나, 그냥 자신의 코드를보다 재사용 할 노력하고있어 최선의 답 것 :

    bindBtn ("#loginbutton",loginAction);

function bindBtn(element,action){

var flag = false;
$(element).bind('touchstart click', function(e) {
    e.preventDefault();
    if (!flag) {
        flag = true;
        setTimeout(function() {
            flag = false;
        }, 100);
        // do something
        action();
    }
    return false;
});

  19. 19.또한 안드로이드 / 아이 패드 웹 응용 프로그램 작업입니다, 그리고 단지 "하는 TouchMove"를 사용하는 경우하는 "이동 부품"(필요 없음의 touchstart)에 충분한 것 같다. touchstart을 사용하지 않도록 설정하면 () .click 사용할 수 있습니다; jQuery를에서. 이 touchstart에 의해 과부하되지 않았기 때문에 실제로 일하고있어.

    또한 안드로이드 / 아이 패드 웹 응용 프로그램 작업입니다, 그리고 단지 "하는 TouchMove"를 사용하는 경우하는 "이동 부품"(필요 없음의 touchstart)에 충분한 것 같다. touchstart을 사용하지 않도록 설정하면 () .click 사용할 수 있습니다; jQuery를에서. 이 touchstart에 의해 과부하되지 않았기 때문에 실제로 일하고있어.

    마지막으로, 당신은 ({e.stopPropagation ();} "touchstart", 기능 (전자)) .live binb 수있다; 클릭 거실, 전파 중지 touchstart 이벤트를 물어 () 트리거하세요.

    그것은 나를 위해 일했습니다.

  20. 20.이 문제를 해결하려고 할 때 고려해야 할 여러 가지가 있습니다. 대부분의 솔루션은 스크롤 깨지거나 제대로 유령 클릭 이벤트를 처리하지 않습니다 중 하나.

    이 문제를 해결하려고 할 때 고려해야 할 여러 가지가 있습니다. 대부분의 솔루션은 스크롤 깨지거나 제대로 유령 클릭 이벤트를 처리하지 않습니다 중 하나.

    전체 솔루션의 https://developers.google.com/mobile/articles/fast_buttons 참조

    NB : 당신은 당 요소를 기준으로 유령 클릭 이벤트를 처리 할 수 ​​없습니다. 지연 클릭은 터치 이벤트가 어떤 방법으로 페이지를 수정 그렇다면, 화면 위치에 의해 발사되고, 클릭 이벤트는 페이지의 새 버전으로 전송됩니다.

  21. 21.클릭을 사용하여 원치 않는 부작용을 방지하기 위해 '와 mouseUp touchend'이벤트 'touchstart의 mousedown'또는 할당하는 것이 효과적 일 수 있습니다.

    클릭을 사용하여 원치 않는 부작용을 방지하기 위해 '와 mouseUp touchend'이벤트 'touchstart의 mousedown'또는 할당하는 것이 효과적 일 수 있습니다.

  22. 22.클릭이 항상 여기에, 터치 이벤트를 따를 것이라는 사실을 활용하는 것은 내가 시간 제한 또는 글로벌 플래그를 사용하지 않고 "유령 클릭"을 없애했던 것입니다.

    클릭이 항상 여기에, 터치 이벤트를 따를 것이라는 사실을 활용하는 것은 내가 시간 제한 또는 글로벌 플래그를 사용하지 않고 "유령 클릭"을 없애했던 것입니다.

    $('#buttonId').on('touchstart click', function(event){
    if ($(this).data("already")) {
        $(this).data("already", false);
        return false;
    } else if (event.type == "touchstart") {
        $(this).data("already", true);
    }
    //your code here
});

    클릭은 요소에 ontouchstart 이벤트가 발생, 플래그 세트 한 후 연속적으로 제거 (무시)를 제공 기본적 때마다.

  23. 23.왜 jQuery를 이벤트 API를 사용하지?

    왜 jQuery를 이벤트 API를 사용하지?

    http://learn.jquery.com/events/event-extensions/

    나는 성공이 간단한 이벤트를 사용했습니다. 그것은을 개선하기 위해, 깨끗한 namespaceable하고 유연한 충분하다.

    var isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent);
var eventType = isMobile ? "touchstart" : "click";

jQuery.event.special.touchclick = {
  bindType: eventType,
  delegateType: eventType
};

  24. 24.당신이 jQuery를 사용하는 경우 다음과 같은 나를 위해 꽤 잘 작동 :

    당신이 jQuery를 사용하는 경우 다음과 같은 나를 위해 꽤 잘 작동 :

    var callback; // Initialize this to the function which needs to be called

$(target).on("click touchstart", selector, (function (func){
    var timer = 0;
    return function(e){
        if ($.now() - timer < 500) return false;
        timer = $.now();
        func(e);
    }
})(callback));

    다른 솔루션은 좋은 그러나 나는 루프에서 여러 이벤트를 바인딩하고 적절한 폐쇄를 만들 수있는 함수를 호출 자기를 필요로했다. 내가 출할-수 다음 클릭 / touchstart에되고 싶어하기 때문에 또한, 나는 바인딩을 해제하고 싶지 않았다.

    비슷한 상황에있는 사람을 도움이 될 수 있습니다!

  25. 25.간단한 기능의 경우, 단지 터치를 인식하거나 나는 다음과 같은 코드를 사용하십시오

    간단한 기능의 경우, 단지 터치를 인식하거나 나는 다음과 같은 코드를 사용하십시오

    var element = $("#element");

element.click(function(e)
{
  if(e.target.ontouchstart !== undefined)
  {
    console.log( "touch" );
    return;
  }
  console.log( "no touch" );
});

    touchstart 이벤트가 정의하지 않고 "더 터치"아니라면 경우이는 "터치"를 반환합니다. 나는이 클릭 / 탭 이벤트 단지를위한 간단한 방법입니다 말했듯이.

  26. 26.나는 이것을 시도하고 지금까지 그것을 작동합니다 (그러나 나는주의의 위험 부담 때문에 안드로이드 / 폰갭에만 오전)

    나는 이것을 시도하고 지금까지 그것을 작동합니다 (그러나 나는주의의 위험 부담 때문에 안드로이드 / 폰갭에만 오전)

      function filterEvent( ob, ev ) {
      if (ev.type == "touchstart") {
          ob.off('click').on('click', function(e){ e.preventDefault(); });
      }
  }
  $('#keypad').on('touchstart click', '.number, .dot', function(event) {
      filterEvent( $('#keypad'), event );
      console.log( event.type );  // debugging only
           ... finish handling touch events...
  }

    나는 모든 터치에 다시 결합 핸들러를 받았음을 사실처럼하지 말고 모든 것을 고려 접촉은 매우 자주 발생하지 않습니다 (컴퓨터 시간에!)

    나는이 길을 갔다 왜 나에게 너무 많은 코드없이 문제를 처리 할 수있는 간단한 기능을 갖는 것은 그래서 나는 '#keypad'에 대한 것과 같은 핸들러의 톤이있다.

  27. 27.jQuery를 모바일에서 가상 마우스 (vmouse) 바인딩을 사용해보십시오. 그것은 특히 경우에 대한 가상 이벤트는 다음과 같습니다

    jQuery를 모바일에서 가상 마우스 (vmouse) 바인딩을 사용해보십시오. 그것은 특히 경우에 대한 가상 이벤트는 다음과 같습니다

    $thing.on('vclick', function(event){ ... });

    http://api.jquerymobile.com/vclick/

    브라우저 지원 목록 : http://jquerymobile.com/browser-support/1.4/

  28. 28.편집 : (이 스레드의 응답에 따라) 내 이전의 대답은 나를 위해 이동하는 방법이 아니었다. I 입력하거나 터치 버튼으로 클릭하고 마우스 휴가 또는 다른 터치 클릭에 붕괴 마우스 확장 하위 메뉴를 원했다. 마우스 이벤트는 일반적으로 터치 이벤트 후 해고되고 있기 때문에, 동시에 두 터치 스크린 및 마우스 입력을 지원하는 이벤트 리스너를 작성하는 종류의 까다로운의했다.

    편집 : (이 스레드의 응답에 따라) 내 이전의 대답은 나를 위해 이동하는 방법이 아니었다. I 입력하거나 터치 버튼으로 클릭하고 마우스 휴가 또는 다른 터치 클릭에 붕괴 마우스 확장 하위 메뉴를 원했다. 마우스 이벤트는 일반적으로 터치 이벤트 후 해고되고 있기 때문에, 동시에 두 터치 스크린 및 마우스 입력을 지원하는 이벤트 리스너를 작성하는 종류의 까다로운의했다.

    나는 (897 바이트가 축소 된) 이벤트가 터치 스크린 또는 마우스에 의해 호출되었는지 여부를 감지 할 수있는 이른바 '터치 마우스'의 플러그인 jQuery를 작성 결국 (터치 지원을 테스트하지 않고!). 이것은 동시에 터치 스크린과 마우스 모두의 지원을 가능하게하고 완전히 자신의 이벤트를 구분합니다.

    영업 빠르게 터치 클릭에 응답 touchstart 또는 touchend를 사용하여 클릭을 클릭하면이 방법은 마우스 만 호출됩니다.

    첫 번째 예를하게한다. body 요소 트랙 터치 이벤트 :

    $(document.body).touchOrMouse('init');

    마우스 이벤트 우리의 기본 방법으로 요소와 ( '수', E) $ body.touchOrMouse를 호출 우리는 이벤트가 터치 스크린 또는 마우스에 의해 호출되었는지 여부를 확인할 수 있습니다 구속.

    $('.link').click(function(e) {
  var touchOrMouse = $(document.body).touchOrMouse('get', e);

  if (touchOrMouse === 'touch') {
    // Handle touch click.
  }
  else if (touchOrMouse === 'mouse') {
    // Handle mouse click.
  }
}

    http://jsfiddle.net/lmeurs/uo4069nh에서 직장에서 플러그인을 참조하십시오.

  29. 29.여기에 그것을 할 수있는 간단한 방법입니다 :

    여기에 그것을 할 수있는 간단한 방법입니다 :

    // A very simple fast click implementation
$thing.on('click touchstart', function(e) {
  if (!$(document).data('trigger')) $(document).data('trigger', e.type);
  if (e.type===$(document).data('trigger')) {
    // Do your stuff here
  }
});

    당신은 기본적으로 루트 문서에 첨부 jQuery의 데이터 객체의 '트리거'속성에 트리거, 이벤트 유형이 '트리거'의 값과 같은 경우에만 실행되는 첫 번째 이벤트 유형 저장. 터치 장치에서 이벤트 체인 가능성 '클릭'다음 'touchstart'이 될 것이다 "클릭" '트리거'( "touchstart")에 저장된 초기 이벤트 유형과 일치하지 않기 때문에 그러나, '클릭'핸들러는 실행되지 않습니다.

    가정, 나는 그것이 안전 하나 믿는다는 '트리거'이벤트 유형 만에 한 번 저장되어 있기 때문에 스마트 폰이 자발적으로 마우스 장치 또는 다른 어느 등록되지 않습니다 탭에 터치 장치에서 변경되지 것입니다 페이지로드 및 "클릭"과 일치하지 않을 것 "touchstart".

    http://codepen.io/thdoan/pen/xVVrOZ : - 여기에 당신이 (더 클릭 지연이 있어야 터치 입력 장치의 버튼을 두드리고 시도하지) 함께 놀러 수 codepen 것

    나는 또한 간단한으로 이것을 구현 jQuery를 플러그인은 또한 선택기 문자열을 전달하여 필터링 jQuery의 후손을 지원합니다 :

    // A very simple fast click plugin
// Syntax: .fastClick([selector,] handler)
$.fn.fastClick = function(arg1, arg2) {
  var selector, handler;
  switch (typeof arg1) {
    case 'function':
      selector = null;
      handler = arg1;
      break;
    case 'string':
      selector = arg1;
      if (typeof arg2==='function') handler = arg2;
      else return;
      break;
    default:
      return;
  }
  this.on('click touchstart', selector, function(e) {
    if (!$(document).data('trigger')) $(document).data('trigger', e.type);
    if (e.type===$(document).data('trigger')) handler.apply(this, arguments);
  });
};

    Codepen : http://codepen.io/thdoan/pen/GZrBdo/

  30. 30.내가 찾은 가장 좋은 방법은 터치 이벤트를 작성하고 프로그래밍 방식으로 해당 이벤트 호출을 일반 클릭 이벤트를하는 것입니다. 이 방법은 모든 일반 클릭 이벤트를 가지고 당신은 모든 터치 이벤트에 대해 하나의 이벤트 처리기를 추가해야합니다. 당신이 만질 수 있도록 할 모든 노드에 대해 단지 터치 핸들러를 호출하는 데에 "만질"클래스를 추가 할 수 있습니다. jQuery로 그것은 확실히 그것의 진정한 터치 이벤트가 아닌 위양성을 만들기 위해 몇 가지 로직과 같이 작동합니다.

    내가 찾은 가장 좋은 방법은 터치 이벤트를 작성하고 프로그래밍 방식으로 해당 이벤트 호출을 일반 클릭 이벤트를하는 것입니다. 이 방법은 모든 일반 클릭 이벤트를 가지고 당신은 모든 터치 이벤트에 대해 하나의 이벤트 처리기를 추가해야합니다. 당신이 만질 수 있도록 할 모든 노드에 대해 단지 터치 핸들러를 호출하는 데에 "만질"클래스를 추가 할 수 있습니다. jQuery로 그것은 확실히 그것의 진정한 터치 이벤트가 아닌 위양성을 만들기 위해 몇 가지 로직과 같이 작동합니다.

    $("body").on("touchstart", ".touchable", function() { //make touchable  items fire like a click event
var d1 = new Date();
var n1 = d1.getTime();
setTimeout(function() {
    $(".touchable").on("touchend", function(event) {
        var d2 = new Date();
        var n2 = d2.getTime();
        if (n2 - n1 <= 300) {
            $(event.target).trigger("click"); //dont do the action here just call real click handler
        }
    });
}, 50)}).on("click", "#myelement", function() {
//all the behavior i originally wanted
});

    31. from https://stackoverflow.com/questions/7018919/how-to-bind-touchstart-and-click-events-but-not-respond-to-both by cc-by-sa and MIT license

'JQUERY' 카테고리의 다른 글

[JQUERY] $ 아약스 오류가 타임 아웃의 경우 결정  (0) 2020.10.04
[JQUERY] jQuery를에 함수를 5 초마다 호출하는 가장 쉬운 방법은 무엇입니까? [복제]  (0) 2020.10.04
[JQUERY] 어떻게 AJAX 요청 주기적으로 해고?  (0) 2020.10.04
[JQUERY] JQuery와 .each () 뒤로  (0) 2020.10.04
[JQUERY] navigator.geolocation.getCurrentPosition 가끔 가끔 작동하지 않습니다  (0) 2020.10.04
,

티스토리툴바