begin process at 2012 02 06 00:39:37
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Formulaire

 > INSERTION À PARTIR DE LA POSITION DU CURSEUR DANS UNE TEXTBOX OU AUTRE.

INSERTION À PARTIR DE LA POSITION DU CURSEUR DANS UNE TEXTBOX OU AUTRE.


 Information sur la source

Note :
Aucune note
Catégorie :Formulaire Classé sous :Insertion, Curseur, Textbox Niveau :Débutant Date de création :17/12/2007 Date de mise à jour :19/12/2007 20:11:51 Vu :7 748

Auteur : vbott

Ecrire un message privé
Site perso
Commentaire sur cette source (10)
Ajouter un commentaire et/ou une note

 Description

D'aprés ce que j'ai vu,il marche déja sur IE et Mozilla.Et donc comme son titre l'indique,il permet d'effectuer une insertion à partir de la position du curseur dans une textbox ou autre.Le modebb permet de récuperer le texte selectionné et de le mettre dans des balises.Ainsi quand le modebb est activé (modebb = true) la valeur du texte à ajouter doit contenir les balises de fin et de début tels que [u][/u].

Source

  • <html>
  • <body>
  • <input name="msg" id="modif"><input type="button" value="Insert" onclick="insert('modif','[u][/u]',true)">
  • <script>
  • <!--
  • function insert(box,text,modebb)
  • {
  • box = document.getElementById(box);
  • var str = box.value;
  • var msgstart = box.selectionStart,msgend = box.selectionEnd; // recupération de la position du curseur
  • var balise = text.split("]");
  • var balisedebut = balise[0] + "]",balisefin = balise[1] + "]"; //recuperation de la balise de debut et de fin
  • if(typeof msgstart == "undefined")// cas IE
  • {
  • box.focus();
  • var caretPos = document.selection.createRange().duplicate();
  • if(!modebb)
  • caretPos.text = text; // modification du texte séléctionné
  • else
  • caretPos.text = balisedebut + caretPos.text + balisefin; // modification du texte séléctionné avec les balises
  • }
  • else // cas autre
  • {
  • if(!modebb)
  • box.value = str.substring(0,msgstart) + text + str.substring(msgend,str.length); // ajout simple a partir de la position du curseur
  • else
  • box.value = str.substring(0,msgstart) + balisedebut + str.substring(msgstart,msgend) + balisefin + str.substring(msgend,str.length); // ici je recupere le texte selectionné et ajoute une balise au début et à la fin
  • box.setSelectionRange(msgstart+text.length,msgstart+text.length); // repositionne le curseur dans la textbox
  • }
  • box.focus();
  • }
  • -->
  • </script>
  • </body>
  • </html>
<html>
<body>
<input name="msg" id="modif"><input type="button" value="Insert" onclick="insert('modif','[u][/u]',true)">
<script>
<!--
function insert(box,text,modebb)
{
box = document.getElementById(box);
var str = box.value;
var msgstart = box.selectionStart,msgend = box.selectionEnd; // recupération de la position du curseur
var balise = text.split("]"); 
var balisedebut = balise[0] + "]",balisefin = balise[1] + "]"; //recuperation de la balise de debut et de fin 
 if(typeof msgstart == "undefined")// cas IE
 {	
 box.focus();
 var caretPos = document.selection.createRange().duplicate();
  if(!modebb)
  caretPos.text = text; // modification du texte séléctionné 
  else
  caretPos.text = balisedebut + caretPos.text + balisefin; // modification du texte séléctionné  avec les balises
  
 }
 else // cas autre
 {
  if(!modebb)
  box.value = str.substring(0,msgstart) + text + str.substring(msgend,str.length); // ajout simple a partir de la position du curseur
  else
  box.value = str.substring(0,msgstart) + balisedebut + str.substring(msgstart,msgend) + balisefin + str.substring(msgend,str.length); // ici je recupere le texte selectionné et ajoute une balise au début et à la fin
 box.setSelectionRange(msgstart+text.length,msgstart+text.length); // repositionne le curseur dans la textbox
 }
box.focus();	
}
-->
</script>
</body>
</html>



 Historique

17 décembre 2007 21:36:57 :
Oubli de mot dans la description.
17 décembre 2007 22:43:29 :
Ajout d'un mode ressemblant aux bbcode
19 décembre 2007 19:28:02 :
ajout de commentaire suite a une demande
19 décembre 2007 20:11:51 :
rectification d'un bug qui empechait l'insertion sur selection

 Sources de la même categorie

Source avec Zip Source avec une capture BOITE DE DIALOGUE MODALE DE SÉLECTION D'UNE LISTE D'ICONES par JJDai
Source avec Zip Source avec une capture RÉSOLUTION D'UN SYSTÈME D'ÉQUATIONS LINÉAIRES À N INCONNUES par william voirol
Source avec Zip Source avec une capture PLUGIN JQUERY LISTE MODIFIABLE (COMBO) AUTOCOMPLÉTÉE par medkarim
GESTION DE NUMÉRO DE TÉLÉPHONE SIMPLE DANS FIREFOX7 par rotomtom
Source avec Zip Source avec une capture RECOMMANDER CETTE PAGE AVEC MAILTO, ACCENT ET RETOUR LIGNE D... par weabow

 Sources en rapport avec celle ci

Source avec Zip DOMBUILDER par Kimjoa
Source avec Zip Source avec une capture RAINBOW CURSOR par wackybacky
Source avec Zip Source avec une capture INSTALLEZ UN CURSEUR GÉANT, SUPER GÉANT CURSEUR DE LA SOURIS... par abdelaziz_info
DRAG & DROP SIMPLE, SIMPLE, SIMPLE par jdmcreator
Source avec Zip Source avec une capture CURSEUR QUI POINTE LA SOURIS par wackybacky

Commentaires et avis

Commentaire de zave le 18/12/2007 22:49:15

Sympa,code utile, mais tu aurais pu commander un peu ton code, car on voit en essayant que ça fonctionne mais on sait pas trop pourquoi.

Commentaire de abdelaziz_info le 18/12/2007 23:37:28

Bonjour ;
Je pense qu'avec ceci on fait la même chose. !?

<html>
<body>
<script type="text/javascript">
<!--
function insert()
{
document.getElementById('modif').value = document.getElementById('modif').value + '[u][/u]';
msg.focus();
}
-->
</script>
<input name="msg" id="modif">
<input type="button" value="Insert" onclick="insert()">
</body>
</html>

Commentaire de vbott le 19/12/2007 19:22:30

Désolé pour le manque de commentaire je pensais avoir été assez clair , donc je m'y pencherais prochainement.Et pour répondre a abdelaziz_info, ton code rajoute simplement a la fin de la textbox alors que j'effectue une insertion a partir du curseur de la textbox.De plus en mode bb je récupere le texte selectioné et le balise.

Commentaire de PetoleTeam le 19/12/2007 19:54:27

Bonjour,

L'insertion ne fonctionne pas sous FireFox, Opera et Safari...

J'ai d'ailleurs fait une approche en son temps, à voir pour info sur http://www.javascriptfr.com/code.aspx?ID=39612

;0)

Commentaire de PetoleTeam le 19/12/2007 20:01:24

OUILLE !
Je rectifie, il fallait lire l'insertion sur sélection ...l'insertion tout court fonctionne nickel !

Commentaire de vbott le 19/12/2007 20:04:04

Firefox tu es sur , j'ai pourtant testé recamment et cela fonctionnait bien. En tout cas tu connaitrais la source de son dyfonctionnement sur les navigateurs que tu as cité ?

Commentaire de vbott le 19/12/2007 20:23:45

Désolé de te contredire mais j'ai fait les différents tests sur opéra et sur safari et cela s'est révelé concluant.  

Commentaire de vbott le 19/12/2007 20:29:05

Encore désolé, au temps pour moi je n'avais pas bien compris. L'erreur etant corrigée depuis peu ils fonctionnent sur ces navigateurs.

Commentaire de abdelaziz_info le 20/12/2007 00:20:29

c'est bien, vbott
Avant les changements c'été la même chose !
Mai maintenant ton code fonctionne.
boncourage

Commentaire de joebuz le 09/03/2008 15:33:45

super, ça fonctionne nikel !

est-il possible de cacher les balises et d'afficher directement dans la textbox le texte en gras, en italique ou en souligné (selon le choix) dans

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

Position curseur dans textbox [ par Coolpix08 ] Bonjour,Voila je désespere un peu et il commence a ce faire tard...J'aimerais simplement récupérer la position du curseur dans le textbox en debut de Insertion champ [ par Sniperman113 ] Bonjour,J'ai un petit soucis avec mon code.Enfaite mon script devrait permettre à l'utilisateur grâce à un simple clique de mettre le contenu d'un cha Placer le curseur à cet endroit [ par Guidelor ] Bonjour J'ai un forum avec une zone texte dans laquelle j'insere des balises genre "&lt;italic&gt;&lt;/italic&gt;" avec des boutons au dessus de la zo Pb : Remplissage d'un textbox [ par ahikaz ] Salut, j'ai créé une liste déroulante et j veux que lorsque l'utilisateur clique sur l'une des valeurs alors 2 textbox se remplissent.Pour le moment j curseur et textarea [ par Slyders ] Bonjour, j'ai un ptit problème :)Je veu insérer des tabulation dans mon textarea, alors j'ai créer un bouton ! &lt;Input type="b Taille d'un curseur en CSS [ par psylo66 ] Bonjour, voila ca fait un petit moment  je cherche a changer la taille du curseur en CSS.j'ai réussit à changer l'image de mon curseur via cette ligne Pb récupération position curseur [ par jlfcdvg ] BonjourJe voudrais soumettre ce problème à votre sagacité.Sur une page destinée à un fichier d'aide au format chm, j'affiche une image dans une bulleM Positionner curseur en haut de la page [ par aloisio11 ] Bonjour,J'ai un problemme peut banal : Je charge une page avec plein de référence, je clique sur le haut de ma page pour pouvoir faire une recherche a Insertion ul dans un div "CSS" [ par younes371 ] Bonjour, voilà mon promblème :j'au un code php qui rempli un ul par des li :&lt;?php   //code de requ ette en php  //........// fin di code  echo '&lt Insertion das un element , les information d'un element parent XML [ par younes371 ] Bonjour, j'ai un petit souci et je demande d'aide.&lt;?xml version="1.0" encoding="UTF-8"?&gt;&lt;arbre&gt;&lt;personne id="P01" sexe="F"&gt;&lt;Nom&g


Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Février 2012
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
272829    

Consulter la suite du CalendriCode

Photothèque

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 6,271 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales