Liste scrollable comportement différent Windows/Android

**andrebernard** · 29/09/2021, 18h20

Bonjour à tous,

Sur ce code
https://www.w3schools.com/code/tryit...e=GUXXPR94SUWT

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html>
<html>
	<head>
        <title>Page Title</title>
	</head>
 
    <body>
 
      <select id="Liste" size="4" onClick=" var Liste=document.getElementById('Liste');alert(Liste.options[Liste.selectedIndex].innerText)">
          <option>Premier</option>
          <option>Second</option>
          <option>Troisieme</option>
          <option>Quatrieme</option>
      </select>
 
	</body>
 
</html>

Lorsque je sélectionne un item de la liste, une alert() apparait immédiatement avec Firefox Windows

Nom : SelectionListeWindows.jpg
Affichages : 95
Taille : 41,8 Ko

Nom : SelectionListeWindows.jpg
Affichages : 95
Taille : 41,8 Ko

Mais lorsque je suis avec Firefox ANDROID et bien une seconde liste identique à celle que je viens de cliquer apparait

ou il faut à nouveau cliquer et valider

Nom : SelectionListeAndroid.png
Affichages : 99
Taille : 93,9 Ko

Cela ne pose pas de problème lorsque la liste n'a que quelques éléments, mais quand il y en a plusieurs centaines, rescroller tout en bas prends énormément de temps sans compter les risques de mauvais resélection
Connaissez vous une méthode (Autre balise, code JS, etc ...) permettant d'avoir le même comportement avec ANDROID qu'avec Windows ?

Je vous remercie et vous souhaite une bonne journée

**Gobble** · 30/09/2021, 13h55

Hello,

J'ai testé avec cette approche et des émulateurs android firefox, ça semble fonctionner mais c'est à vérifier

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
<select id="box1" onChange="myNewFunction(this);">
        <option value="98">dog</option>
        <option value="7122">cat</option>
        <option value="142">bird</option>
    </select>
    <script>
        function myNewFunction(sel) {
            alert(sel.options[sel.selectedIndex].text);
        }
    </script>

**andrebernard** · 01/10/2021, 19h54

Bonjour Gobble,

Merci de ta réponse

Cela vient peut être de l'émulateur ANDROID si cela marche chez toi, mais ton code a le même effet que le miens sur mon téléphone
C'est à dire ce panneau de sélection qui apparait alors que j'ai déjà sélectionné l'élément

Après de nombreuses recherches depuis hier, j'ai lu dans un forum anglais qu’apparemment c'est un comportement normal de Firefox

Et que l'on ne peut pas y faire grand chose

Je suis donc en train de remplacer la ListBox par une multitudes de boutons dans un champs scrollable pour en faire une virtuellement qui n'a pas ce comportement

Maintenant si quelqu'un a une idée un peu moins "brute de pomme"

je suis toujours preneur

Encore merci de ton aide, je te souhaite une bonne journée

Liste scrollable comportement différent Windows/Android

JavaScript

Discussions similaires

Partager

Partager