Comment puis-je insérer du texte à la position du curseur dans une zone de texte à l'aide de JavaScript/jQuery ?

Insérer un texte là où se trouve le curseur avec Javascript/jquery

Lorsque vous travaillez avec des pages contenant beaucoup de texte, il peut être nécessaire d'insérer du texte à des points spécifiques, en particulier lorsque déclencher des événements à l’aide de liens. Cet article explique comment insérer du texte à la position du curseur ou l'ajouter à la zone de texte ciblée, quel que soit le type d'élément à l'aide de JavaScript ou de jQuery.

Une solution efficace exploite la fonction insertAtCaret. Il identifie le type de navigateur (Internet Explorer ou Firefox) et la position du curseur en fonction de la propriété selectionStart ou de la méthode createRange de l'élément. La fonction modifie ensuite le contenu de l'élément, en ajoutant le texte souhaité à la position du curseur.

Pour implémenter cette solution, incluez simplement la fonction et le gestionnaire d'événements fournis dans votre code :

function insertAtCaret(areaId, text) {
  // Function to insert text at the cursor position
  ...
}

// Event handler to insert text on link click
document.querySelector('a').addEventListener('click', function() {
  insertAtCaret('textareaid', 'text to insert');
});

Par en utilisant cette technique, vous pouvez insérer dynamiquement du texte à la position du curseur, améliorant ainsi l'expérience utilisateur et simplifiant la manipulation du texte sur vos pages Web.

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!