Bonjour,

Voila je rencontre un petit problème avec mon code.
je voudrais coller du texte dans un textarea
Mon HTML&CSS

<!DOCTYPE html>
<html>
<head>
    <title>HelpMeToTranscribe</title>
    <style>
        label,small{
            display: block;
            font-size: 14px;
            font-family: sans-serif;
        }
        small{
            position: absolute;
            left: 49vw;
        }
        small a{
            text-decoration: none;
            color: red;
        }
        #transcription{
            font-family: sans-serif;
            font-size: 16px;
            width: 50vw;
            height: 10vh;
            background-color: white;
            flex-direction: column;
            white-space: normal;
            border: 2px solid #444;
            border-radius: 2px;
            padding: 10px;
        }
    </style>
</head>
<body>

    <form action="">
        <label for="transcription">Transcribe</label>
        <textarea name="transcription-box" id="transcription">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt, natus quia accusamus at, reiciendis, modi voluptate soluta placeat virgule nam pariatur rerum tenetur accusantium aperiam, minima ipsum nesciunt quo ipsum enim officiis. Officia.
        </textarea>
        <small><a href="#" id="verifier">verifier</a></small>
    </form>
</body>
</html>

Mon JS

<script>
    //variables
    var textarea = document.querySelector('#transcription')
    var verifier = document.querySelector('#verifier')
    var valeur = textarea.value
    var check = ['.\\POINT',',\\VRIGULE','F. R.','S. M. S.','G. P. S.']
    var keymap = {
        '0' => '<SN/>',
        '1' => '<NPS/>',
        '2' => '<UNKNOWN/>',
        '3' => '<FILL/>',
        '4' => '<CNOISE/>',
        '7' => '<NIS> <UNKNOWN/> </NIS>',
        '8' => '<NIS></NIS>'
    }
    //regex
    var regex = /virgule/im
    //met toutes les mots en minuscule
    var to_l = valeur.toLowerCase()
    //remplace par le regex ci-dessus
    var show = to_l.replace(regex,',\\VIRGULE')
    //scinde les mots du champ en prenant en compte 
    //ceux qui ont été modifié
    var decoupe = show.trim().split(' ')

    //lorsque tu cliques
    verifier.addEventListener('click', function(e) {
        //annule l'evenement par defaut du lien
        e.preventDefault()
        //affiche le tableau de mots scindés
        console.log(decoupe);

        //affiche le resultat au niveau du champ
        textarea.textContent = show
    });

    document.addEventListener('keyup', function(e) {

        if (e.keyCode === 96) {
            textarea.textContent = '</SN>'
            console.log('</SN>');
        } else {
            console.log('-_-');
        }
    });

je voudrais faire un système de raccourcis comme vous le voyez dans le tableau keymap
et je voudrais que lorsqu'on appuie sur une des touches raccourci le texte correspondant soit coller où se trouve le curseur

je ne sais pas trop par où commencer.
Merci d'avance

5 réponses


hello,
on va procéder dans l'ordre :

  1. ta def de keymap n'est pas bonne : tu veux définir un object '{' alors que tu def un array associatif 'php' de surcroit... tu dois corriger ça...
    ensuite tu n'y fais même pas appel... j'imagine que c un test....
    commente ton keymap et tu auras un résultat (mais ce ne sera pas le bon....)
    réponse dans point 2.
    ;)

re, regarde ce post et liens qui vont avec... ça peut aider ;)

je ne veux pas creer un objet JS mais belle et bien un tableau.
sauf si c'est pas comme ça que ça s'écrit.
merci pour les liens je vais les regarder

;) si tu veux déclarer correctement un object, il faut faire ça :

vvar keymap = {
        '0' : '<SN/>',
        '1' : '<NPS/>',
        '2' : '<UNKNOWN/>',
        '3' : '<FILL/>',
        '4' : '<CNOISE/>',
        '7' : '<NIS> <UNKNOWN/> </NIS>',
        '8' : '<NIS></NIS>'
}

tu pourras l'utiliser come un tableau...

je ne veux pas déclarer d'objet.c'est un tableau que je declare.
un tableau avec des clés.
ah c'est vrai je me suis trompé sur la syntaxe.je vois mtn.
mais bon là n'est pas le probleme.
Le probleme c'est de pouvoir faire un coller des valeurs du tableau où est positionné le curseur