Comment puis-je obtenir la position du curseur dans un champ de saisie de texte ?

Détermination de la position du curseur dans un champ de saisie de texte

Obtenir la position du curseur dans un champ de saisie de texte peut améliorer l'expérience utilisateur et simplifier certaines fonctionnalités. Voici comment y parvenir :

Solution jQuery

Pour une approche simple, vous pouvez utiliser la propriété selectionStart de l'élément de champ de saisie. Cette propriété renvoie l'index de caractères de la position actuelle du curseur dans le champ.

$("#myinput").on("input", function() {
  let caretPosition = $(this).prop("selectionStart");
});

Solution JavaScript personnalisée

Alternativement, si un plugin jQuery n'est pas souhaité, vous peut implémenter une fonction JavaScript personnalisée. Cette fonction exploite les propriétés selectionStart ou selectionEnd, selon le sens de la sélection.

function doGetCaretPosition(oField) {
  let iCaretPos = 0;

  if (oField.selectionStart || oField.selectionStart == '0')
    iCaretPos = oField.selectionDirection == 'backward' ? oField.selectionStart : oField.selectionEnd;

  return iCaretPos;
}

Cette fonction peut être facilement intégrée à votre code en l'appelant avec le champ de saisie approprié comme argument.

Mise en œuvre

Une fois que vous avez la position du curseur, vous pouvez l'utiliser pour exécuter diverses tâches, telles que comme :

• Insérer du texte à l'emplacement spécifié
• Mettre en surbrillance une région spécifique
• Effectuer une validation de texte en fonction de la position du curseur

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!