Czy zdarzenia dotyku nie działają z elementami wprowadzania tekstu w iPadzie Safari?

Question

W iPadzie Safari zaprogramowałem zdarzenia dotykowe DIV, aby po dotknięciu wewnątrz DIV i przytrzymaniu tam palca przez 500   ms, zmieni się kolor tła DIV.

Kiedy próbuję przenieść kod do elementu wprowadzania tekstu (wewnątrz zestawu pól), czyniąc go celem dotykowym zamiast DIV, kod nie działa. Tekst-input zostaje wybrany na przekór tym CSS:

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

Czy nie ma sposobu, aby przechwytywać zdarzenia naciśnięcie jednego elementu tekstowego-input w iPadzie Safari i obsługiwać je w niestandardowy sposób, zapobieganie domyślne zachowanie? Czy jest coś dodatkowego, co muszę zrobić, aby uzyskać dane wejściowe na poparcie tego? Próbowałem z i bez manekina obsługi kliknij: onclick = "void (0)".

To jest dokument, który obserwuję dokumentację: Handling Events.

Answer 1

Byłoby pomocne, gdyby opublikowałeś swój kod, ale myślę, że prawdopodobnie musisz po prostu zapobiec domyślnemu zachowaniu na wydarzeniach dotyku. Wygląda to mniej więcej tak, gdy przy użyciu jQuery:

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

Answer 2

spróbować wyłączyć i zrobić wejście tylko do odczytu:

<input type="text" readonly /> 

Answer 3

Jeśli nie zadzwonić preventDefault() w kodzie programu obsługi, przeglądarka automatycznie przekazać dotknij zdarzenia do domyślnej implementacji (po tym, jak myślisz, że sobie z tym poradziłeś). Domyślną implementacją jest wybranie pola.

W takim przypadku zadzwoń pod numer preventDefault() i stopPropagation() w programie obsługi, a następnie zwróć wartość false. Zapobiega to dalszemu bulgotaniu. Wtedy możesz całkowicie kontrolować swój element wejściowy.

Zastrzeżenie: utracisz także domyślne zachowanie pola wejściowego! Innymi słowy, nie będziesz mógł wprowadzać tekstu na pole! Lub jeśli pole wejściowe to <select>, nie będzie można podciągnąć listy itp.

Przypuszczam, że tak naprawdę chcesz: 1) Jeśli użytkownik naciśnie i przytrzyma przez 500ms, a następnie zmieni kolor na żółty, 2) i/lub przy zwolnieniu aktywuj pole wejściowe. W takim przypadku będziesz musiał ręcznie odnawiać zdarzenie w górę, jeśli naprawdę chcesz użyć pola wejściowego.

Tego rodzaju sytuacja jest bardzo powszechna podczas programowania iPada. Na przykład w wielu przypadkach chciałbyś wykryć ruch przeciągnięcia dotykowego (nawet w polu wejściowym) i zinterpretować go jako ruch, ale zinterpretować ruch zwolnienia dotykowego (bez ruchu) jako kliknięcie, aby aktywować pole wejściowe . Musisz zrobić to, co sugeruję powyżej: preventDefault() i, jeśli to konieczne, polecam wydarzenie.