Mam textbox i jego etykietę na stronie. Domyślnie jeśli masz pola tekstowe na stronie, będzie obsługuje funkcję tap to paste w iPadzie. W moim przypadku jestem w stanie stuknąć i wkleić.

<div class="labelwrap">
<label for="srl_input" >Serial Number...</label>
<input type="text" id="srl_input" class="serial_input">
</div>

Ale jeśli użyję CSS i zachować tę etykietę w polu Textbox, tracę tę funkcję. Myślę, że kiedy dotknę w polu Textbox właściwie to jest etykieta, która dostaje ostrość, a tym samym nie widzę żadnej opcji do wklejania. Jeśli ustawię display: none na etykietę, a następnie mogę użyć tap to paste. Infact jeśli ustawię z-index: -1, w takim przypadku mogę wkleić tekst. Ale w obu tych przypadkach etykieta nie jest wyświetlana w terenie pola tekstowego (oczywiście :)).

Daj mi znać, jak mogę mieć etykietę w terenie pola tekstowym i nadal ma funkcję tap and paste. Etykieta musi być wyświetlana, aż w polu Textbox nie ma charakteru

Str.s. Nie używam placeholder atrybutu HTML5.

1
Rakesh Juyal 31 lipiec 2012, 20:28

2 odpowiedzi

Najlepsza odpowiedź

Jeśli dobrze cię zrozumiałem, to dlatego, że etykieta siedzi na górze pola tekstowego, więc faktycznie klikając go, a nie w polu tekstowym. Możesz spróbować użyć Zdarzenia wskaźnika CSS, aby zatrzymać etykietę reagując na kliknięcia. Najwyraźniej są obsługiwane przez webkit, ale nie wiem konkretnie o iPadzie. Daj to:

.labelwrap label {
    pointer-events: none;
}

Aby zniknąć, gdy textbox jest skupiony, spróbuj tego:

.labelwrap input:focus {
    z-index: 1; /* Or something greater than that of the <label> */
}
1
Olly Hodgson 31 lipiec 2012, 16:58
<input type="text" id="srl_input" class="serial_input" placeholder="Serial Number...">
0
Nikola K. 31 lipiec 2012, 16:36