Computing">
[Go to site: main page, start]

0% ont trouvé ce document utile (0 vote)
10 vues19 pages

Introduction à JavaScript et ses avantages

JavaScript est un langage de programmation dynamique et léger, principalement utilisé pour créer des pages web interactives. Il permet d'exécuter des scripts côté client, offrant des avantages tels que la validation des entrées utilisateur sans interaction serveur et une interactivité accrue. Bien qu'il ait des limitations, comme l'absence de support pour le multithreading et l'accès aux fichiers, JavaScript reste essentiel pour le développement web moderne.

Traduit par

ScribdTranslations
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd
0% ont trouvé ce document utile (0 vote)
10 vues19 pages

Introduction à JavaScript et ses avantages

JavaScript est un langage de programmation dynamique et léger, principalement utilisé pour créer des pages web interactives. Il permet d'exécuter des scripts côté client, offrant des avantages tels que la validation des entrées utilisateur sans interaction serveur et une interactivité accrue. Bien qu'il ait des limitations, comme l'absence de support pour le multithreading et l'accès aux fichiers, JavaScript reste essentiel pour le développement web moderne.

Traduit par

ScribdTranslations
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats PDF, TXT ou lisez en ligne sur Scribd

Collège d'Ingénierie Lakireddy Bali Reddy (Autonome)

Les bases de JavaScript

Que'st-cequeJavaScrp
i?t

JavaScript est un langage de programmation informatique dynamique. Il est léger et la plupart


couramment utilisé comme partie des pages web, dont les implémentations permettent le côté client
script pour interagir avec l'utilisateur et créer des pages dynamiques. C'est un langage interprété

langage de programmation avec des capacités orientées objet.

JavaScript était d'abord connu sous le nom de LiveScript, mais Netscape a changé son nom en

JavaScript, possiblement en raison de l'excitation générée par Java. JavaScript


a fait sa première apparition dans Netscape 2.0 en 1995 sous le nom de LiveScript.
Le cœur général de la langue a été intégré dans Netscape, Internet
Explorateur et autres navigateurs web.

JavaScript est un langage de programmation léger et interprété.

Conçu pour créer des applications centrées sur le réseau.

Complémentaire à et intégré avec Java.

Complémentaire et intégré au HTML.

Ouvert et multiplateforme

JavaScriptcôtéclient
Le JavaScript côté client est la forme la plus courante du langage. Le script devrait
être inclus dans ou référencé par un document HTML pour que le code soit interprété par
le navigateur.

Cela signifie qu'une page web ne doit pas être un HTML statique, mais peut inclure des programmes qui
interagir avec l'utilisateur, contrôler le navigateur et créer dynamiquement du contenu HTML.

Le mécanisme côté client de JavaScript offre de nombreux avantages par rapport à la CGI traditionnelle.
scripts côté serveur. Par exemple, vous pourriez utiliser JavaScript pour vérifier si l'utilisateur a
a entré une adresse e-mail valide dans un champ de formulaire.

Le code JavaScript est exécuté lorsque l'utilisateur soumet le formulaire, et uniquement si tous les
les entrées sont valides, elles seraient soumises au serveur Web.

JavaScript peut être utilisé pour intercepter des événements initiés par l'utilisateur tels que des clics de boutons, des liens

navigation, et d'autres actions que l'utilisateur initie explicitement ou implicitement.

1
Collège d'Ingénierie Lakireddy Bali Reddy (Autonome)

AvantagesdeJavaScript
Les avantages de l'utilisation de JavaScript sont −

Moins d'interaction avec le serveur - Vous pouvez valider les saisies utilisateur avant d'envoyer le

page hors du serveur. Cela réduit le trafic serveur, ce qui signifie moins de charge sur votre
serveur.

Retour immédiat aux visiteurs− Ils n'ont pas à attendre une page
rechargez pour voir s'ils ont oublié d'entrer quelque chose.

Interactivité accrue − Vous pouvez créer des interfaces qui réagissent lorsque l'utilisateur

survole avec une souris ou les active via le clavier.

Interfaces plus riches - Vous pouvez utiliser JavaScript pour inclure des éléments tels que le glisser-déposer.

et des composants de glisser-déposer et des curseurs pour offrir une interface riche à vos visiteurs du site.

LimitationsofJavaScript
Nous ne pouvons pas considérer le JavaScript comme un langage de programmation à part entière. Il lui manque le

les caractéristiques importantes suivantes −

Le JavaScript côté client ne permet pas la lecture ou l'écriture de fichiers. Cela a


été conservé pour des raisons de sécurité.

JavaScript ne peut pas être utilisé pour des applications réseau car il n'existe pas de tel
soutien disponible.

JavaScript n'a pas de capacités multithreading ou multiprocesseur.

Encore une fois, JavaScript est un langage de programmation léger et interprété qui
vous permet d'intégrer de l'interactivité dans des pages HTML autrement statiques.

Syntaxe JavaScript

JavaScript peut être mis en œuvre à l'aide d'instructions JavaScript qui sont placées à l'intérieur de
les balises <script>... </script> HTML dans une page web.

Vous pouvez placer les balises <script>, contenant votre JavaScript, n'importe où dans votre
page web, mais il est normalement recommandé de la garder dans
les balises <head>.

La balise <script> avertit le programme du navigateur de commencer à interpréter tout le texte


entre ces balises en tant que script. Une syntaxe simple de votre JavaScript apparaîtra comme
suit.

2
Collège d'ingénierie Lakireddy Bali Reddy (Autonome)

<script ...>
Code JavaScript
</script>

La balise script prend deux attributs importants −

Langue − Cet attribut spécifie quel langage de script vous utilisez.


En général, sa valeur sera javascript. Bien que les versions récentes de HTML (et
XHTML, son successeur) a abandonné l'utilisation de cet attribut.

Type− Cet attribut est ce qui est maintenant recommandé pour indiquer le script
la langue en usage et sa valeur doivent être définies sur "text/javascript".

Donc, votre segment JavaScript ressemblera à -

<script language="javascript" type="text/javascript">


Code JavaScript
</script>

VotrePremierScriptJavaScript
Prenons un exemple pour imprimer "Bonjour le monde".
nous appelons une fonction [Link] qui écrit une chaîne dans notre document HTML.
Cette fonction peut être utilisée pour écrire du texte, du HTML, ou les deux. Jetez un œil au suivant.

code.

<html>
<corps>
<script language="javascript" type="text/javascript">
[Link]("Hello World!");
</script>
</body>
</html>

Ce code produira le résultat suivant −

Bonjour le monde!

Espacesetsautsdeligne
JavaScript ignore les espaces, les tabulations et les nouvelles lignes qui apparaissent dans les programmes JavaScript.

Vous pouvez utiliser des espaces, des tabulations et des nouvelles lignes librement dans votre programme et vous êtes libre de

formatez et indentez vos programmes de manière soignée et cohérente, ce qui rend le code
facile à lire et à comprendre.

3
Lakireddy Bali Reddy Collège d'Ingénierie (Autonome)

Lep
sonistv-riguelsonaftcuatlsfit

Les déclarations simples en JavaScript sont généralement suivies d'un caractère point-virgule, juste
comme ils le sont en C, C++ et Java. JavaScript, cependant, vous permet d'omettre cela.
point-virgule si chacune de vos déclarations est placée sur une ligne séparée. Par exemple, le
le code suivant pourrait être écrit sans points-virgules.

<script langue="javascript" type="text/javascript">


var1 = 10
var2 = 20
</script>

Mais lorsqu'il est formaté sur une seule ligne comme suit, vous devez utiliser des points-virgules −

<script language="javascript" type="text/javascript">


var1 = 10; var2 = 20;
</script>

Remarque : il est bon de programmer en utilisant des points-virgules.

Diférencedecasse
JavaScript est un langage sensible à la casse. Cela signifie que les mots-clés du langage,
les variables, les noms de fonction et tout autre identifiant doivent toujours être typés avec un
capitalisation cohérente des lettres.

Ainsi, les identifiants Time et TIME auront des significations différentes en JavaScript.

REMARQUE− Une attention particulière doit être portée lors de l'écriture des noms de variables et de fonctions dans

JavaScript.

CommentsinJavaScript
JavaScript prend en charge à la fois les commentaires de style C et les commentaires de style C++, donc -

Tout texte entre // et la fin d'une ligne est traité comme un commentaire et est
ignoré par JavaScript.

Tout texte entre les caractères /* et */ est considéré comme un commentaire. Cela peut
s'étendre sur plusieurs lignes.

JavaScript reconnait également la séquence d'ouverture de commentaire HTML <!--.


JavaScript traite ceci comme un commentaire sur une seule ligne, tout comme il le fait pour le commentaire //.

La séquence de fermeture de commentaire HTML --> n'est pas reconnue par JavaScript donc elle
devrait être écrit comme //-->.

4
Collège d'ingénierie Lakireddy Bali Reddy (Autonome)

Exemple
L'exemple suivant montre comment utiliser des commentaires en JavaScript.

<script language="javascript" type="text/javascript">


<!--
// Ceci est un commentaire. Il est similaire aux commentaires en C++

/*
* Ceci est un commentaire multilignes en JavaScript

* C'est très similaire aux commentaires en programmation C

*/
//-->
</script>

JavaScrp
it-PalcementdansunfciheirHTML

Il y a une flexibilité donnée pour inclure du code JavaScript n'importe où dans un HTML
document. Cependant, les moyens les plus préférés d'inclure JavaScript dans un fichier HTML
sont les suivants −

Script dans la section <head>...</head>.

Script dans la section <body>...</body>.

Script dans les sections <body>...</body> et <head>...</head>.

Script dans un fichier externe puis inclure dans la section <head>...</head>.

Dans la section suivante, nous allons voir comment nous pouvons placer JavaScript dans un fichier HTML.
différentes manières.

JavaScriptdanslasection<head><
. /head>
Si vous voulez qu'un script s'exécute lors d'un événement, par exemple lorsque l'utilisateur clique

quelque part, vous placerez ce script dans l'en-tête comme suit −

<html>
<tête>
<script type="text/javascript">
function direBonjour() {
alerte("Bonjour le monde")
}
</script>

</tête>

<body>
<input type="button" value="Say Hello" />

</body>

5
Collège d'Ingénierie Lakireddy Bali Reddy (Autonome)

</html>

JavaScriptdanslasection<body><
. /body>
Si vous avez besoin d'un script à exécuter au chargement de la page afin que le script génère du contenu dans

la page, puis le script se trouve dans la portion <body> du document. Dans ce cas,
vous n'auriez aucune fonction définie en utilisant JavaScript. Jetez un coup d'œil au
code suivant.

<html>

<tête>
</tête>

<body>

<script type="text/javascript">
[Link]("Bonjour le monde")
</script>
<p>Ceci est le corps de la page web</p>

</body>
</html>

JavaScriptdanslessections<body>et<head>

You can put your JavaScript code in <head> and <body> section altogether as
suit −

<html>
<tête>
<script type="text/javascript">
fonction direBonjour() {
alerte("Bonjour le monde")
}
</script>
</tête>

<corps>
<script type="text/javascript">
[Link]("Bonjour le monde")
</script>

<input type="button" value="Say Hello" />

</body>
</html>

JavaScrp
itdansunfciheirexterne

Voici un exemple pour montrer comment vous pouvez inclure un fichier JavaScript externe dans votre
Code HTML utilisant la balise script et son attribut src.

<html>

<tête>
<script type="text/javascript" src="[Link]" ></script>
</tête>

<body>

6
Collège d'ingénierie Lakireddy Bali Reddy (Autonome)

</body>
</html>

To use JavaScript from an external file source, you need to write all your JavaScript
code source dans un fichier texte simple avec l'extension ".js" et ensuite inclure ce fichier comme
montré ci-dessus.

Par exemple, vous pouvez garder le contenu suivant dans [Link] et ensuite vous
vous pouvez utiliser la fonction sayHello dans votre fichier HTML après avoir inclus le fichier [Link].

fonction direBonjour() {
alerte("Bonjour le monde")

Possibilités d'affichage JavaScript

JavaScript peut "afficher" des données de différentes manières :

Écrire dans un élément HTML, en utilisant innerHTML.


Écriture dans la sortie HTML en utilisant [Link]().
Écriture dans une boîte d'alerte, en utilisant [Link]().

Écrire dans la console du navigateur, en utilisant [Link]().

Utilisation de innerHTML

To access an HTML element, JavaScript can use the [Link](id) method.

L'attribut id définit l'élément HTML. La propriété innerHTML définit le HTML


content:

Exemple :

<!DOCTYPE html>
<html>
<corps>

<h1>Ma Première Page Web</h1>


<p>Mon premier paragraphe</p>

<p id="demo"></p>

<script>
[Link]("demo").innerHTML =“welcome”;
</script>

</corps>
</html>

Utiliser [Link]()

7
Lakireddy Bali Reddy College of Engineering (Autonomous)

Exemple :
<!DOCTYPE html>
<html>
<body>

<h1>Ma Première Page Web</h1>


<p>Mon premier paragraphe.</p>

<script>
[Link]("bienvenue dans javascript");
</script>

</corps>
</html>

Note:Using [Link]() after an HTML document is fully loaded, willdelete all


HTML existant

Utiliser [Link]()

Vous pouvez utiliser une boîte de dialogue pour afficher des données :

<!DOCTYPE html>
<html>
<corps>

<h1>Ma Première Page Web</h1>


<p>Mon premier paragraphe.</p>

<script>
[Link](“welcome”);
</script>

</body>
</html>
Utiliser [Link]()

Pour des raisons de débogage, vous pouvez utiliser la méthode [Link]() pour afficher des données.

<!DOCTYPE html>
<html>
<corps>

<script>
[Link]("bienvenue");
</script>

</body>
</html>

VariablesJavaScript

8
Collège d'ingénierie Lakireddy Bali Reddy (Autonome)

Comme beaucoup d'autres langages de programmation, JavaScript a des variables. Les variables peuvent être
considérés comme des conteneurs nommés. Vous pouvez placer des données dans ces conteneurs et ensuite
faites simplement référence aux données en nommant le conteneur.

Before you use a variable in a JavaScript program, you must declare it. Variables are
déclaré avec le mot-clé comme suit.

<script type="text/javascript">
var argent;
var nom;
</script>

Vous pouvez également déclarer plusieurs variables avec le même mot-clé var comme suit −

<script type="text/javascript">
var argent, nom;
</script>

Stocker une valeur dans une variable s'appelle l'initialisation de variable. Vous pouvez le faire avec une variable.

initialisation au moment de la création de la variable ou à un moment ultérieur lorsque vous en avez besoin
cette variable.

Par exemple, vous pourriez créer une variable nommée argent et lui assigner la valeur
2000,50 à plus tard. Pour une autre variable, vous pouvez assigner une valeur au moment de
initialisation comme suit.

<script type="text/javascript">
var name = "Ali";
var argent;
money = 2000.50;
</script>

Note− Use thevarkeyword only for declaration or initialization, once for the life of
tout nom de variable dans un document. Vous ne devez pas redéclarer la même variable deux fois.

JavaScript est un langage non typé. Cela signifie qu'une variable JavaScript peut contenir un
valeur de tout type de données. Contrairement à de nombreux autres langages, vous n'avez pas à le dire

JavaScript lors de la déclaration de variable, quel type de valeur la variable va-t-elle contenir.
le type de valeur d'une variable peut changer pendant l'exécution d'un programme et
JavaScript s'en occupe automatiquement.

PortéedesvariablesJavaScript

9
Collège d'ingénierie Lakireddy Bali Reddy (Autonome)

La portée d'une variable est la région de votre programme dans laquelle elle est définie.
Les variables JavaScript n'ont que deux portées.

Variables globales - Une variable globale a une portée globale, ce qui signifie qu'elle peut être définie

partout dans votre code JavaScript.

Variables locales - Une variable locale ne sera visible que dans une fonction où elle est définie.
Les paramètres de fonction sont toujours locaux à cette fonction.

Dans le corps d'une fonction, une variable locale a la priorité sur une variable globale.
variable with the same name. If you declare a local variable or function parameter
avec le même nom qu'une variable globale, vous cachez effectivement la variable globale.
Jetez un œil à l'exemple suivant.

<html>
<body > <script type="text/javascript">
var maVar = "global"; // Déclarer une variable globale
fonction vérifier la portée() {

var myVar = "local"; // Déclarer une variable locale

[Link](myVar);
}
</script>
</body>
</html>

NomsdevariablesJavaScript
While naming your variables in JavaScript, keep the following rules in mind.

Vous ne devez pas utiliser les mots réservés JavaScript comme variable.
nom. Ces mots-clés sont mentionnés dans la section suivante. Pour
exemple, break ou les noms de variables boolean ne sont pas valides.

JavaScript variable names should not start with a numeral (0-9). They must
commencez par une lettre ou un caractère de soulignement. Par exemple, 123test est un
nom de variable invalide mais_123test est un nom valide.

JavaScript variable les noms sont sensible à la casse. Par exemple,


Nameandnameare two different variables.

10
Collège d'ingénierie Lakireddy Bali Reddy (Autonome)

JavaScript–Objects
JavaScript est un langage de programmation orienté objet (POO). Un programme de
un langage peut être qualifié d'orienté objet s'il offre quatre capacités de base à
développeurs

Encapsulation - la capacité de stocker des informations liées, qu'il s'agisse de données ou de méthodes,

ensemble dans un objet.

Agrégation - la capacité de stocker un objet à l'intérieur d'un autre objet.

Hérédité - la capacité d'une classe à s'appuyer sur une autre classe (ou sur un certain nombre de classes)

pour certaines de ses propriétés et méthodes.

Polymorphisme - la capacité d'écrire une fonction ou une méthode qui fonctionne dans une variété de
différentes manières.

Les objets sont composés d'attributs. Si un attribut contient une fonction, il est
considéré comme une méthode de l'objet, sinon l'attribut est considéré comme un
propriété.

Propriétésdesobjets
Les propriétés d'objet peuvent être n'importe lequel des trois types de données primitifs, ou n'importe lequel des abstraits.

des types de données, tels qu'un autre objet. Les propriétés d'un objet sont généralement des variables qui sont

utilisé en interne dans les méthodes de l'objet, mais peut aussi être des variables visibles globalement qui
sont utilisés sur toute la page.

La syntaxe pour ajouter une propriété à un objet est −

[Link]=propertyValue;

Par exemple - Le code suivant obtient le titre du document en utilisant


la propriété "title" de l'objet document.

varstr=[Link];

Méthodesd'objet
Les méthodes sont les fonctions qui permettent à l'objet de faire quelque chose ou de permettre que quelque chose soit fait.

Il y a une petite différence entre une fonction et une méthode - une fonction est un
unité autonome d'énoncés et une méthode est attachée à un objet et peut être
référencé par le mot-clé this.

Les méthodes sont utiles pour tout, de l'affichage du contenu de l'objet à la


écran pour effectuer des opérations mathématiques complexes sur un groupe de propriétés locales
et paramètres.

11
Collège d'ingénierie Lakireddy Bali Reddy (Autonome)

Par exemple − Voici un exemple simple pour montrer comment utiliser


la méthode write() de l'objet document pour écrire du contenu sur le document.

[Link]("Ceci est un test");

Obejd
sténifp
siau
s'railiteur

Tous les objets définis par l'utilisateur et les objets intégrés sont des descendants d'un objet

calledObject.

Le nouvel Opérateur
L'opérateur new est utilisé pour créer une instance d'un objet. Pour créer un objet,
thenewoperator est suivi par la méthode constructeur.

Dans l'exemple suivant, les méthodes de constructeur sont Object(), Array() et Date().
Ces constructeurs sont des fonctions intégrées de JavaScript.

var employé = new Object();


var books = new Array("C++", "Perl", "Java");
var jour = new Date("15 août 1947");

The Object() Constructor


Un constructeur est une fonction qui crée et initialise un objet. JavaScript fournit
une fonction constructeur spéciale appelée Object() pour construire l'objet. La valeur de retour de
Le constructeur theObject() est assigné à une variable.

La variable contient une référence au nouvel objet. Les propriétés assignées au


Les objets ne sont pas des variables et ne sont pas définis avec le mot-clé var.

Exemple 1
Essayez l'exemple suivant ; il démontre comment créer un objet.

<html>
<tête>
<title>User-defined objects</title>
<script type="text/javascript">
var book = new Object(); // Créer l'objet
[Link] = "Perl"; // Assign properties to the object
[Link] = "Mohtashim";
</script>
</tête>
<corps>
<script type="text/javascript">
[Link]("Le nom du livre est : " + [Link] + "<br>");

[Link]("L'auteur du livre est : " + [Link] + "<br>");

12
Collège d'ingénierie Lakireddy Bali Reddy (Autonome)

</script>
</corps>
</html>

Sortie
Book name is : Perl
Book author is : Mohtashim

Exemple 2
Cet exemple démontre comment créer un objet avec une fonction définie par l'utilisateur.
Le mot-clé 'this' est utilisé pour faire référence à l'objet qui a été passé à une fonction.

<html>
<tête>
<title>User-defined objects</title>
<script type="text/javascript">
fonction livre(titre, auteur){
[Link] = title;
[Link] = author;
}
</script>

</tête>
<corps>

<script type="text/javascript">
var myBook = new book("Perl", "Mohtashim");
[Link]("Book title is : " + [Link] + "<br>");
[Link]("Book author is : " + [Link] + "<br>");
</script>

</body>
</html>

Sortie
Book title is : Perl
Book author is : Mohtashim

Définirdesméthodespourunobjet

13
Collège d'Ingénierie Lakireddy Bali Reddy (Autonome)

Les exemples précédents montrent comment le constructeur crée l'objet et


assigne des propriétés. Mais nous devons compléter la définition d'un objet en assignant
méthodes pour cela.

Exemple
Try the following example; it shows how to add a function along with an object.

<html>
<tête>
<title>User-defined objects</title>
<script type="text/javascript">
// Définir une fonction qui agira comme une méthode
function addPrice(amount){
[Link] = amount;
}
fonction livre(titre, auteur) {
[Link] = title;
[Link] = auteur;
[Link] = addPrice; // Assigner cette méthode comme propriété.

}
</script>
</tête>
<corps>
<script type="text/javascript">
var myBook = new book("Perl", "Mohtashim");
[Link](100);
[Link]("Le titre du livre est : " + [Link] + "<br>");

[Link]("Book author is : " + [Link] + "<br>");


[Link]("Book price is : " + [Link] + "<br>");
</script>
</body>
</html>

Sortie
Book title is : Perl
Book author is : Mohtashim
Le prix du livre est : 100

Lemot-clé'avec'

14
Collège d'ingénierie Lakireddy Bali Reddy (Autonome)

Le mot-clé 'avec' est utilisé comme une sorte d'abréviation pour référencer un objet.
properties or methods.

L'objet spécifié comme argument à avec devient l'objet par défaut pour le
durée du bloc qui suit. Les propriétés et méthodes de l'objet peuvent être
utilisé sans nommer l'objet.

Syntaxe
La syntaxe pour avec un objet est la suivante −

avec(object){
propriétés utilisées sans le nom de l'objet et le point

Exemple
Essayez l'exemple suivant.

<html>
<tête>
<title>User-defined objects</title>
<script type="text/javascript">
// Définir une fonction qui fonctionnera comme une méthode

fonction ajouterPrix(montant){

avec ceci :
price = amount;
}
}
fonction livre(titre, auteur) {
[Link] = title;
[Link] = auteur;
[Link] = 0;
[Link] = addPrice; // Assign that method as property.
}
</script>
</tête>
<corps>
<script type="text/javascript">
var myBook = new book("Perl", "Mohtashim");
[Link](100);

[Link]("Le titre du livre est : " + [Link] + "<br>");

[Link]("L'auteur du livre est : " + [Link] + "<br>");

15
Collège d'ingénierie Lakireddy Bali Reddy (Autonome)

[Link]("Le prix du livre est : " + [Link] + "<br>");

</script>
</corps>
</html>

Sortie

Book title is : Perl


L'auteur du livre est : Mohtashim
Le prix du livre est : 100

JavaScript form validation

Validation de formulaire Java Script pour les champs vides

<html>
<tête>
<script>
fonction validerFormulaire()
{
var un = [Link];
var pass = [Link];
var gen = [Link];
var age = [Link];
var mail = [Link];
var cntry = [Link];
var lan = [Link];
if(un=="" || un=="null")
{
alerte("veuillez entrer votre nom");
[Link]();
renvoyer faux;

}
si(pass=="" || pass=="null")
{
alerte("veuillez entrer votre mot de passe");
[Link]();
renvoie faux;
}
si(gen=="" || gen=="null")
{
alert("Please select the gender");
[Link][0].focus();
renvoyer faux;

}
si(age=="" || age=="null")
{
alerte("veuillez entrer votre âge");
[Link]();
retourner faux;

16
Collège d'ingénierie Lakireddy Bali Reddy (autonome)

si(mail=="" || mail=="null")
{
alerte("veuillez entrer votre email");
[Link]();
retourner faux;
}
si(cntry == "Par défaut")
{
alerte("veuillez sélectionner votre pays")
[Link]();
retourner faux;
}
pour (var i=0; i<[Link]; i++)
{
si(lan[i].vérifié)
pause;
}
si(i==[Link])
{
alerte("Veuillez choisir vos langues");
[Link][0].focus();
retourner faux;
}
Alerte("Inscription réussie");
retourner vrai;
}
</script>
</tête>
<corps>
<form name="inscription" validateForm();">
Entrez votre nom : <input type="text" name="uname"><br>
Entrez votre mot de passe : <input type="password" name="pwd"><br>
Choose your Gender: <input type="radio" name="gender" value="Male">Male
<input type="radio" name="gender" value="Female">Female<br>
Entrez votre âge : <input type="number" name="age"><br>
Entrez votre email : <input type="text" name="email"><br>
Choisissez votre pays :
<select name="pays">
<option value="Default">(Please select a country)</option>
<option value="aus">Australia</option>
<option value="can">Canada</option>
<option value="ind">India</option>
<option value="rus">Russia</option>
<option value="usa">USA</option>
</select><br>
Languages Known:
<input type="checkbox" name="lang" value="Telugu"/>
English: <input type="checkbox" name="lang" value="English"/>
Hindi: <input type="checkbox" name="lang" value="Hindi"/><br>

<input type="submit"><input type="reset">


</form>
</body>
</html>
Validation de formulaire JavaScript :
a) User Name: Veuillez entrer uniquement des lettres
b) Age : veuillez entrer uniquement des chiffres

17
Collège d'ingénierie Lakireddy Bali Reddy (Autonome)

c) Password: au moins une lettre minuscule, une majuscule et un caractère spécial.

<html>
<tête>
<script>
fonction validerFormulaire()
{
var un = [Link];
var age = [Link];
var pass = [Link];
var letters = /^[a-zA-Z\s]+$/;
var nombres = /^[0-9]+$/;
var checkSpecial = /[*@!#%&]+/.test(pass);
var checkUpper = /[A-Z]+/.test(pass);
var checkLower = /[a-z]+/.test(pass);
var drapeau = 0;
si(un=="" || un=="null")
{
alerte("veuillez entrer votre nom");
[Link]();
retourner faux;
}
si(![Link](lettres))
{
alerte("veuillez entrer uniquement des lettres")
[Link]();
return false;
}
si(age=="" || age=="null")
{
alerte("veuillez entrer votre âge");
[Link]();
retourner faux;

}
si(![Link](nombres))
{
alert("please enter numbers only")
[Link]();
retourner faux;
}
si(pass=="" || pass=="null")
{
alerte("veuillez entrer votre mot de passe");
[Link]();
retourner faux;
}

if(checkSpecial && checkLower && checkUpper)


{
flag = 1;
}
si(flag == 0)
{
Alerte("Le mot de passe doit être la combinaison d'au moins une lettre minuscule, d'une lettre majuscule
lettre et symboles spéciaux comme ($, & #)
[Link]();

18
Collège d'ingénierie Lakireddy Bali Reddy (Autonome)

retourner faux;
}
alerte("Inscription réussie");
retourner vrai;
}
</script>
</head>
<corps>
<form name="inscription" validateForm();">
Entrez votre nom : <input type="text" name="uname"> Veuillez entrer uniquement des alphabets<br>
Entrez votre âge : <input type="text" name="age"> veuillez entrer des chiffres seulement<br>
Entrez votre mot de passe : <input type="text" name="pwd">au moins une lettre minuscule, une lettre majuscule &
caractère spécial<br>
<input type="submit"><input type="reset">
</form>
</body>
</html>
Validation des e-mails en JavaScript :

<html>
<tête>
<script>
function validerFormulaire()
{
var mail = [Link];
si(mail=="" || mail=="null")
{
alerte("veuillez entrer votre email");
[Link]();
retourner faux;
}
var atpos = [Link]("@");
var dotpos = [Link](".");
si (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= [Link])
{
Alerte("Adresse e-mail non valide");
retourner faux;
}
alerte("Inscription réussie");
renvoyer vrai;
}
</script>
</head>
<corps>
<form name="inscription" validerFormulaire();">
Entrez votre e-mail : <input type="text" name="email"><br>
<input type="submit"><input type="reset">
</form>
</body>
</html>

19

Vous aimerez peut-être aussi