11521 sujets

JavaScript, DOM et API Web HTML5

Hello,

Je vois pas du tout comment faire... Je cherche à simuler l'action du bouton entrée, simuler le fait qu'un utilisateur appuie sur cette touche (qui porte la key 13). Le problème c'est que sur l'internet je trouve uniquement avec du jquery... je cherche uniquement en pure js... Smiley decu

je cherche pas à "detecter" via un trigger si on appuie sur Entrée, mais je cherche à réaliser l'action; à la manière d'un .submit() ou d'un .click()

est ce possible ?


EDIT :

En Jquery voici le code :

e = jQuery.Event("keypress")
e.which = 13 //choose the one you want
    $("#test").keypress(function(){
     alert('keypress triggered')
    }).trigger(e)



exemple si on click sur run, la touche est directement simulé

je cherche exactement la même chose en javascript pure et j'ère.... Smiley murf
Modifié par JENCAL (31 Aug 2016 - 14:59)
JENCAL a écrit :
Hello,

Je vois pas du tout comment faire... Je cherche à simuler l'action du bouton entrée, simuler le fait qu'un utilisateur appuie sur cette touche (qui porte la key 13). Le problème c'est que sur l'internet je trouve uniquement avec du jquery... je cherche uniquement en pure js... Smiley decu

je cherche pas à "detecter" via un trigger si on appuie sur Entrée, mais je cherche à réaliser l'action; à la manière d'un .submit() ou d'un .click()

est ce possible ?


EDIT :

En Jquery voici le code :

var e = jQuery.Event("keypress");
e.which = 13; 
e.keyCode = 13;
$("#theInputToTest").trigger(e);


exemple si on click sur run, la touche est directement simulé

je cherche exactement la même chose en javascript pure et j'ère.... Smiley murf

Non testé, tiré d'un forum sur le sujet (anglais) :
function eventFire(el, etype){
  if (el.fireEvent) {
    el.fireEvent('on' + etype);
  } else {
    var evObj = document.createEvent('Events');
    evObj.initEvent(etype, true, false);
    el.dispatchEvent(evObj);
  }
}

Usage :
eventFire(document.getElementById('mytest1'), 'click');

Pour d'autres réponses, chercher avec les mots clés sur Google : javascript simulate click
sepecat a écrit :

Pour d'autres réponses, chercher avec les mots clés sur Google : javascript simulate click


Merci sepecat pour ta réponse.. je vais chercher à modifier ton code un peu
Par contre je ne cherche pas à simuler une click mais la touche entrée.
et les recherches Google j'en est mangé bien comme il faut Smiley langue
Modifié par JENCAL (31 Aug 2016 - 15:11)
Bonjour !

Lorsque j'avais appris à utiliser les événements avec le site du Zéro, il y avait un paragraphe sur 'déclencher soi-même les événements'.

Je viens de regarder sur son successeur, OpenClassrooms, je ne trouve plus ce paragraphe.

Pour info, il était question des méthodes 'createEvent', 'initEvent' et 'dispatchEvent'... (Edit : pour 'keypress', il semblerait que ce soit initUIEvent() qui est utilisé...)

Après un rapide tour d'horizon, il semblerait que 'createEvent' et 'initEvent' soient, à présent, dépréciés...
https://developer.microsoft.com/en-us/microsoft-edge/platform/documentation/dev-guide/dom/dom-event-constructors/

En fin de compte, c'est toujours un peu le même problème: l'hétérogénéité du support entre les anciennes et les nouvelles méthodes.

Smiley smile
Modifié par Zelena (31 Aug 2016 - 15:19)
Merci de ta réponse également !

j'ai trouvé dispatchEvent en début d'aprem et je continue d'approfondir mes recherches et mes tests ^^

Merci encore et dommage pour le paragraphe disparut ^^
Bonjour,

Sauf si tu développes ton propre composant d'interface, ce que je te déconseille fortement par ailleurs, tu ne devrais pas tenter de surcharger l'appui sur la touche enter.
Tu devrais au contraire réagir par exemple à l'évènement submit dans le cas des formulaires, ou à l'évènement click pour les liens et les boutons (car oui, click est déclenché quand on appuie sur enter quand le focus est sur un lien ou un bouton).

Pourquoi ? parce que dans un contexte inattendu, l'utilisateur risque d'être coincé.
Que se passe-t-il si je viens sur ta page avec mon téléphone et sans clavier blutooth ? Comment je valide ton action qui ne se déclenche que quand je presse sur enter ?

Il en va autrement si tu développes ton propre composant à partir de <div> et <span>. Dans ce cas c'est effectivement à toi de gérer les différentes façons d'utiliser ton composant, et dans ce cadre-là spécifiquement alors oui c'est important de gérer la touche enter si ça a un sens pour ton composant d'être activé.
Mais en général, non; il faut utiliser les évènements génériques indépendants du mode d'entrée: submit, click, focus/blur... ceci afin d'être sûr que l'utilisateur ait toujours un moyen d'activer l'élément.
ET bien sûr au maximum utiliser les composants de base <a>, <input>, <select>, <button>, plutôt que de réinventer la roue; même si la roue s'appelle JQuery.

Mon explication sera sans doute plus évidente à comprendre si tu remplaces keydown par mousedown dans ta question initiale. Pas facile d'expliquer ce que je pense, j'espère que ça a été clair.

Le nom de l'évènement click est en fait mal choisi, il a été conservé pour des raisons historiques. Si je m'appelais W3C aujourd'hui, je l'appellerais activate. Click est bien un évènement générique indépendant du mode d'entrée.
Salut QuentinC,

Merci pour ta réponse, je n'ai pas tout compris à 100% mais je pense que tu m'a quand même très bien éclaircie sur le sujet.

Je vais jouer franc jeux, ce n'est pas un composant d'interface ce que je développe mais plus un "bot" qui permettra de liker automatiquement certains rsx sociaux et avec du js pure console

Je vais tenter le focus + clic sur textbox voir si cela fonctionne. Le but est de soumettre le formulaire sans faire un .submit(), car le submit recharge la page, ce que je ne désire pas. Le touche Enter du clavier par contre, lorsque je le fait manuellement, ne recharge en rien la page.

Je dois encore un peu mettre les pieds dans le plats mais je pense être sur la bonne voie.

Merci.
Le .submit() ne recharge pas forcément la page, si tu réagis à l'évènement submit, et si tu return false et preventDefault.

C'est de cette façon que devraient être conçus tous les formulaires qui s'envoie par AJAX.
Modifié par QuentinC (05 Sep 2016 - 19:11)
Toujours pas résolu ? Smiley decu
J'ai aussi besoin de simuler une touche (pas forcement la touche entrer)
HELP
En gros j'ai besoin de déclencher l'appuie d'une touche du clavier dans un input pour redéclencher la recherche de champs..
PS: le jquery ne fonctionne pas..

Alex
Modifié par alex7 (23 May 2018 - 10:38)
Si pardon, on peut :

// Listen for the enter key press.
document.body.addEventListener( 'keyup', function (e) {
  if ( e.keyCode == 13 ) {

  }
});


à toi de chercher/voir les keyCode existants.
oui mais ce n'est pas la detection de l'appuie de touche que je cherche Smiley confus
Tant pis ce n'est pas bien grave je vais essayer d'une autre manière.
Modifié par alex7 (23 May 2018 - 15:52)
Bonjour JENCAL,

JENCAL a écrit :
j'ai trouvé dispatchEvent en début d'aprem et je continue d'approfondir mes recherches et mes tests ^^


As tu réussit avec dispatchEvent ?
aliasdmc a écrit :
Bonjour JENCAL,



As tu réussit avec dispatchEvent ?



Non, sans grand succès... après je n'ai pas trop trop forcé la compréhension du pourquoi du comment Smiley smile
aliasdmc a écrit :
Bonjour JENCAL,



As tu réussit avec dispatchEvent ?



Non, sans grand succès... après je n'ai pas trop trop forcé la compréhension du pourquoi du comment Smiley smile