Lors de la simulation de frappe dans Chrome, pourquoi la mauvaise clé est-elle enregistrée ?

La simulation de frappe dans Chrome se déclenche normalement mais pas la bonne clé

La simulation d'événements de frappe sur un élément de zone de texte dans Chrome est essentielle pour des interactions utilisateur personnalisées. Cependant, certaines tentatives peuvent donner des résultats inattendus.

Vous avez tenté de lancer un événement keydown en utilisant initKeyboardEvent avec le keyCode souhaité, mais la zone de texte a fini par enregistrer une valeur de clé incorrecte (Entrée au lieu de la lettre prévue). Une approche alternative impliquant le remplacement de propriété s'est également avérée infructueuse.

Pour résoudre ce problème, vous devez remplacer la propriété « which » en plus de « keyCode ». Voici un exemple de code modifié :

<code class="js">document.addEventListener('keydown', e =&gt; console.log(
  'altKey                : ' + e.altKey + '\n' +
  'charCode (Deprecated) : ' + e.charCode + '\n' +
  'code                  : ' + e.code + '\n' +
  'ctrlKey               : ' + e.ctrlKey + '\n' +
  'isComposing           : ' + e.isComposing + '\n' +
  'key                   : ' + e.key + '\n' +
  'keyCode (Deprecated)  : ' + e.keyCode + '\n' +
  'location              : ' + e.location + '\n' +
  'metaKey               : ' + e.metaKey + '\n' +
  'repeat                : ' + e.repeat + '\n' +
  'shiftKey              : ' + e.shiftKey + '\n' +
  'which (Deprecated)    : ' + e.which + '\n' +
  'isTrusted             : ' + e.isTrusted + '\n' +
  'type                  : ' + e.type
));

const Podium = {};
Podium.keydown = function(k) {
  const oEvent = document.createEvent('KeyboardEvent');

  // Chromium Hack
  Object.defineProperty(
    oEvent,
    'keyCode',
    {
       get : function() {
         return this.keyCodeVal;
       }
    }
  );
  Object.defineProperty(
    oEvent,
    'which',
    {
       get : function() {
         return this.keyCodeVal;
       }
    }
  );

  if (oEvent.initKeyboardEvent) {
    oEvent.initKeyboardEvent("keydown", true, true, document.defaultView,
                             false, false, false, false, k, k);
  }
  else {
      oEvent.initKeyEvent("keydown", true, true, document.defaultView,
                          false, false, false, false, k, 0);
  }

  oEvent.keyCodeVal = k;

  if (oEvent.keyCode !== k) {
    alert("keyCode mismatch " + oEvent.keyCode + "(" + oEvent.which + ")");
  }

  document.dispatchEvent(oEvent);
}

//Sample usage
Podium.keydown(65);</code>

En remplaçant à la fois « keyCode » et « which », vous vous assurez que le code de clé correct et la clé correspondante sont enregistrés lors des événements keydown. Cette approche corrige le problème d'enregistrement incorrect des clés et permet des simulations de frappe précises.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!