IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Insertion de caractères spéciaux


Sujet :

JavaScript

Vue hybride

Douzout Insertion de caractères... 13/12/2012, 18h08
SylvainPV Bonjour, La partie... 13/12/2012, 18h53
Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre averti
    Profil pro
    Inscrit en
    Juillet 2005
    Messages
    44
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juillet 2005
    Messages : 44
    Par défaut Insertion de caractères spéciaux
    Bonjour,

    Je cherche à permettre aux utilisateurs d'insérer quelques caractères spéciaux dans leurs champs de formulaires, mais je ne souhaite pas installer tout un éditeur de texte "riche".
    J'ai trouvé quelque chose qui fonctionne (je mets l'exemple en fin de message)
    et je crée un petit bouton du style
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    document.write("<span onclick='insertion(\"\330\",\"\");'>\330</span>");
    (j'appelle une fonction JS pour afficher mon petit bouton. Mon exemple permet d'afficher le "O slash", pour symboliser un diamètre)
    Cela fonctionne bien, mais le problème de la fonction JS que j'ai trouvée est qu'il faut indiquer "en dur" dans la fonction le champ dans lequel insérer le symbole, et le caractère ne s'insère donc pas dans le champ "dans lequel est l'utilisateur".

    Pourriez-vous m'aider à implémenter cela ?

    Bonne soirée, merci d'avance pour votre aide

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
            "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
    <title>Insertion de contenu dans un champ de saisie à plusieurs lignes</title>
    <script type="text/javascript">
    <!--
    function insertion(repdeb, repfin) {
      var input = document.forms['formulaire'].elements['saisie'];
      input.focus();
      /* pour l'Explorer Internet */
      if(typeof document.selection != 'undefined') {
        /* Insertion du code de formatage */
        var range = document.selection.createRange();
        var insText = range.text;
        range.text = repdeb + insText + repfin;
        /* Ajustement de la position du curseur */
        range = document.selection.createRange();
        if (insText.length == 0) {
          range.move('character', -repfin.length);
        } else {
          range.moveStart('character', repdeb.length + insText.length + repfin.length);
        }
        range.select();
      }
      /* pour navigateurs plus récents basés sur Gecko*/
      else if(typeof input.selectionStart != 'undefined')
      {
        /* Insertion du code de formatage */
        var start = input.selectionStart;
        var end = input.selectionEnd;
        var insText = input.value.substring(start, end);
        input.value = input.value.substr(0, start) + repdeb + insText + repfin + input.value.substr(end);
        /* Ajustement de la position du curseur */
        var pos;
        if (insText.length == 0) {
          pos = start + repdeb.length;
        } else {
          pos = start + repdeb.length + insText.length + repfin.length;
        }
        input.selectionStart = pos;
        input.selectionEnd = pos;
      }
      /* pour les autres navigateurs */
      else
      {
        /* requête de la position d'insertion */
        var pos;
        var re = new RegExp('^[0-9]{0,3}$');
        while(!re.test(pos)) {
          pos = prompt("Insertion à la position (0.." + input.value.length + "):", "0");
        }
        if(pos > input.value.length) {
          pos = input.value.length;
        }
        /* Insertion du code de formatage */
        var insText = prompt("Veuillez entrer le texte à formater:");
        input.value = input.value.substr(0, pos) + repdeb + insText + repfin + input.value.substr(pos);
      }
    }
    //-->
    </script>
    </head>
    <body>
      <h1>Démo: Insertion de contenu dans un champ de saisie à plusieurs lignes</h1>
      <p>Positionnez simplement le curseur dans le champ de saisie ou marquez-y du texte.
         Choisissez ensuite "Insérer" pour insérer <code>[link]...[/link]</code> à cet endroit, dans la mesure où votre navigateur le permet.</p>
      <form name="formulaire" action="">
        <p><textarea name="saisie" cols="30" rows="10">Votre message</textarea></p>
        <p><input type="button" value="Insérer" onClick="insertion('[link]', '[/link]')"></p>
      </form>
    </body>
    </html>

  2. #2
    Rédacteur/Modérateur

    Avatar de SylvainPV
    Profil pro
    Inscrit en
    Novembre 2012
    Messages
    3 375
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Novembre 2012
    Messages : 3 375
    Par défaut
    Bonjour,

    La partie délicate, c'est que si l'utilisateur doit cliquer sur un bouton pour saisir un caractère spécial, alors il perd le focus du champ qu'il était en train de modifier. Donc difficile de savoir le champ dans lequel il est

    Tu peux enregistrer en Javascript le dernier champ focus par l'utilisateur , mais c'est un peu du bricolage.

Discussions similaires

  1. Réponses: 7
    Dernier message: 24/05/2011, 17h45
  2. Réponses: 7
    Dernier message: 13/05/2009, 13h15
  3. Insert et caractères spéciaux
    Par eulstef dans le forum Langage SQL
    Réponses: 6
    Dernier message: 01/01/2008, 21h19
  4. Réponses: 4
    Dernier message: 09/10/2006, 16h19
  5. [SQL2]Insertion de caractères spéciaux
    Par willowII dans le forum Langage SQL
    Réponses: 4
    Dernier message: 26/10/2004, 15h33

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo