le déclenchement manuel d'événement tactile
J'ai cherché pour les 30 dernières minutes, mais n'a pas trouvé une solution.
Je veux déclencher une touchstart
événement sur un élément.
Il déclenche l' touchstart
événement:
var e = document.createEvent('MouseEvent');
e.initMouseEvent("touchstart", true, true, window, 1, screenX, screenY, clientX, clientY,
ctrlKey, altKey, shiftKey, metaKey, button, relatedTarget);
target.dispatchEvent(e);
Remarque que les variables sont définies par ma fonction
Mais il y a un problème avec ça. Le event
objet ne possède pas un touches
de la propriété. Donc quelque chose comme cela ne fonctionne pas:
var touch = e.touches[0];
Est-il un moyen de déclencher une touchstart
événement manuellement (il devrait fonctionner sur Android >= 4.0 et de Chrome avec une touche activée [DevTools]) ?
Veuillez noter, que je ne veux PAS utiliser un framework comme jQuery. Avec jQuery, il est facile de créer un touchevent
sur un élément 😉
- Juste pour la santé mentale, pourquoi avez-vous besoin pour générer un événement?
- Eh bien, disons que j'ai un conteneur. Ce conteneur a de nombreux sous-conteneur qui sont cachés. Quand je touche sur ce conteneur, un sous-conteneur devient visible, et tant que je touche le conteneur, je devrais être en mesure de déplacer le sous-conteneur par un déplacement de mon doigt. Alors, quand je touche le conteneur, un
touchstart
événement doit être créé sur le sous-conteneur. - Cela sonne comme quelque chose qui devrait être assez facile à faire sans truquer les événements. Si votre modèle ne sait sur le conteneur de dépendance, vous pouvez contrôler tous à partir de la seule origine de l'événement.
- Eh bien, c'est un peu plus compliqué et je ne peux pas le faire à votre manière :/ j'ai pour le faux de l'événement...
Vous devez vous connecter pour publier un commentaire.
Selon W3C
Puis, aussi changer
à
Que vous avez créé un
touchstart
événement.Le W3C lien dit:
De sorte que vous aurez peut avoir recours à des
e.initUIEvent('touchstart', true, true);
En outre, l'agent spec indique également que le
TouchList
objet est facultatif, et peuvent être créés manuellement à l'aide de lacreateTouchList
méthode. Pour ajouter un touch à cette liste, vous devrez appeler lacreateTouch
méthode, où vous pouvez passer toutes les coordonnées et tel:Si cela ne fonctionne pas, vous pouvez essayer ceci:
doit travailler, il fait plus de sens que
createEvent('MouseEvent')
en tout cas...Mais pour des fins de test, pourquoi ne pas ouvrir votre google chrome console et vérifier
Emulate touch events
, en plus de remplacer l'agent utilisateur d'Android 4. (Ctrl+Maj+j > cliquez sur l'engrenage en bas à droite, et sélectionnez les Remplacements, vous y trouverez tous les paramètres dont vous avez besoin)Depuis le toucher-les événements ont un long chemin à parcourir, toujours en termes de leur devenir normalisé, il s'avère que la
touches
propriété est pas RO (encore?), vous pouvez donc utiliser cette quick-fix (qui l'OP trouvé et utilisé avec le résultat souhaité):Qui, je pense (je ne peux pas le croire si ce n'était pas le cas) est plus rapide que:
createEvent('TouchEvent')
. :/ Et en Chrome, j'obtiens cette erreur:Uncaught Error: NotSupportedError: DOM Exception 9
. Et avec[DevTools]
dans ma question je voulais dire que j'avais outils de dev tactiles. 😉TouchList
objet est facultatif, et vous serez d'avoir à créer manuellement unTouch
objet à l'aide de lacreateTouchList
etcreateTouch
méthodes respectivemente.touches = [{pageX: pageX, pageY: pageY}];
(e
est l'événement créé). Mais votre solution est certainement mieux!createTouchList
ont été dépréciées donc je ne peux pas utiliser votre suggestion.createEvent
était pas obsolète, aujourd'hui. Si les choses ont changé, qu'ils ont, il pourrait être intéressant de mettre à jour un existant/a accepté de répondre. J'ai déménagé sur le développement back-end seulement. Je ne peux pas garder les réponses jusqu'à ce jour.Je sais que cela a été répondu, mais j'ai trop de mal à trouver une réponse à ce problème et l'on a accepté la réponse n'a pas fonctionné pour moi. En fin de compte, la solution que j'ai trouvé est vraiment très simple et a une prise en charge dans les navigateurs:
Que c'est. Ne pouvait pas être plus facile.
Je suis venu avec cette solution (javascript natif), fonctionne pour moi
Nous peut déclencher comme ceci: