View  Edit  Attributes  History  Attach  Print  Search

jQuery : Un clic bouton modifie un textarea

Téléchargement

Ce que l'on va faire ici

  • Dans ce code jQuery intégré dans une page HTML, un clic bouton ajoute du texte à un champ texte.

Le code HTML + jQuery

<!DOCTYPE HTML>

        <!-- Debut de la page HTML  -->
         <html>

                <!-- Debut entete -->
                <head>

                        <meta charset="utf-8" /> <!-- Encodage de la page  -->
                        <title>Titre</title> <!-- Titre de la page -->

                        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

                        <!-- Debut du code Javascript  -->
                        <script language="javascript" type="text/javascript">
                        <!--

                                var compt=0

                                $(document).ready(function(){

                                        $("#button").click(function(){

                                                compt=compt+1
                                                $("#textarea").append("Clic bouton "+compt+"\n");
                                                textarea.setSelectionRange(textarea.selectionEnd-1,textarea.selectionEnd-1); // se place a la fin -1 pour avant saut de ligne

                                        }); // fin $("#myButton").click

                                });  // fin $(document).ready          

 

                        //-->
                        </script>
                        <!-- Fin du code Javascript -->    

                </head>
                <!-- Fin entete -->

         <!-- Debut Corps de page HTML -->
        <body >

                        <button id="button">Click me !</button>
                        <br />
                        <textarea id="textarea"></textarea>

                </body>
                <!-- Fin de corps de page HTML  -->

         </html>
         <!-- Fin de la page HTML  -->