Signature_pad: 서명이 작동하지 않음 Google Chrome, 휴대기기(너비 >= 1080)

왜 그런 일이 일어날 수 있는지 전혀 몰랐습니다. scroll 이벤트에 대한 리스너를 추가하고 "스크롤링 진행 중"이라는 오류 메시지가 올바른지 확인할 수 있습니까?

쩝. 어딘가에 데모를 설정할 수 있습니까? 나는 아마도 1080보다 높은 해상도를 가진 Android 태블릿을 가지고 있습니다.

지연 돼서 죄송합니다.

예, 저는 할수 있습니다.

내가 당신을 위해 데모를 설정할 수 있는지 보자.

@szimek ,

코드펜:

• 편집자: https://codepen.io/cristhiandt/pen/bZmBQx?editors=1111
• 태블릿에서 테스트: https://codepen.io/cristhiandt/full/bZmBQx

scroll 이벤트에 대한 리스너를 추가했습니다. "스크롤링"은 브라우저 콘솔을 엽니다.

@szimek

안녕,

확인해보셨나요? @szimek :C

안녕,

나는 이와 동일한 문제가 있었는데 창 로드 및 창 크기 조정 기능 내에서 다음을 구현하여 문제를 해결했다고 생각합니다(저도 jQuery를 사용하고 있습니다).

$('canvas.sig_canvas').each(function(){
  var id = $(this).attr('id'); //Get the ID of signature
  var width = $(this).closest('.sig_container').width(); //Get the width of the signature container
  sig_pads[id].off(); //Unbind all events on signature pad (I have an array of them)

  if(!$(this).data('prev_width') || Math.abs(width - $(this).data('prev_width')) > 30){ //Resize threshold 30px, only resize if previous width has changed by 30 pxs
    var ctx = $(this)[0].getContext('2d'); //Get context
    $(this).attr('width', width); //Set canvas width
    ctx.canvas.width  = width; //Set context width
    $(this).data('prev_width', width); //Update prev_width for threshold
  }
  sig_pads[id].on(); //Rebind all signature events
});

바인딩 해제 및 리바인딩인지 또는 캔버스 너비와 고정된 것으로 보이는 컨텍스트 너비를 설정했는지 확실하지 않습니다.

도움이 되기를 바랍니다.

@Steeveuk 사물에 따르면 SignaturePadInstance.off()를 사용하고 SignaturePadInstance.on()으로 다시 활성화하십시오.