iPad Safari에서 터치 이벤트가 텍스트 입력 요소로 작동하지 않습니까?

Question

iPad Safari에서 DIV의 터치 이벤트를 프로그래밍하여 DIV 내부를 터치하고 500   ms 동안 손가락을 길게 누르면 DIV의 배경색이 변경됩니다.

코드를 텍스트 입력 요소 (필드 세트 내부)로 이동하려고 할 때 DIV 대신 터치 대상이되면 코드가 작동하지 않습니다. 텍스트 입력이 CSS에도 불구하고 선택됩니다 :

input[type=text] {-webkit-touch-callout:none; -webkit-user-select:none } 

아이 패드 사파리에서 텍스트 입력 요소의 터치 이벤트를 차단하고 기본 동작을 방지, 사용자 정의 방식으로 그들을 처리 할 수있는 방법은 없습니까? 아니면 이것을 지원하기 위해 내가해야 할 일이 있습니까? 난 더미 클릭 처리기없이 시도 : onclick = "void (0)".

이 문서는 다음 문서의 내용입니다. Handling Events.

Answer 1

코드를 게시하는 것이 도움이되지만 터치 이벤트의 기본 동작을 막아야한다고 생각합니다.

$("#ID") 
     .bind("touchstart", 
      function (e) { 
       e.preventDefault(); 
       //do something 
      }) 
     .bind("touchmove", 
      function (e) { 
       if (e.preventDefault) { 
        e.preventDefault(); 
       } 
       //do something 
      }); 

Answer 2

시도를 해제하고 읽기 전용 입력을 만들기 위해 : 당신이 당신의 핸들러 코드에 preventDefault()를 호출하지 않는 경우

<input type="text" readonly /> 

Answer 3

, 브라우저가 자동으로 전달합니다 jQuery를 사용하는 경우는 다음과 같이 보입니다 터치 이벤트를 통해 기본 구현 (당신이 그것을 처리했다고 생각한 후). 기본 구현은 필드를 선택하는 것입니다.

귀하의 경우에는 처리기에서 및 stopPropagation()으로 전화하고 false를 반환하십시오. 이렇게하면 이벤트가 더 이상 버블 링되지 않습니다. 그런 다음 입력 요소를 완전히 제어 할 수 있습니다.

경고 : 그러면 입력 필드의 기본 동작도 사라집니다. 즉, 필드에 텍스트를 입력 할 수 없습니다! 또는 입력란이 <select> 인 경우 목록 등을 올릴 수 없습니다.

사용자가 실제로 원하는 것은 다음과 같습니다. 1) 사용자가 500ms 동안 누르고 있으면 노란색으로 바뀝니다. 2) 및/또는 릴리스시 입력 필드를 활성화하십시오. 이 경우 입력 필드를 실제로 사용하려는 경우 수동으로 이벤트를 위로 수정해야합니다.

이런 상황은 iPad 프로그래밍시 매우 일반적입니다. 예를 들어 많은 경우에 (입력 필드 에서조차도) 터치 드래그 동작을 감지하여이를 이동으로 해석하고 터치 릴리즈 동작을 (이동하지 않고) 클릭 필드로 해석하여 입력 필드를 활성화하려고 할 수 있습니다 . 위에 제안한 내용을 수행해야합니다 (preventDefault()). 필요하면 이벤트를 다시 시작해야합니다.