Accéder au contenu principal

Exercice JQuery:table d'étudiant 'N°1


Enoncé

Réaliser un formulaire d'ajoutaion des notes qui contient les champs (voir ci-dessus).


table étudiant en jquery
  • nom (contient au moins 3 caractére)
  • note (entre 0 et 20)
  • button Ajouter entrer les données sur la table
1. ecrire le code Html et css qui produit le formulaire
2.En utilisant jquery
   a.Ecrire le code du button Ajouter
   b.Ecrire le code qui calculer moyenne

Correction

Code HTML
    
<table>
  <tr>
     <td>Joueurs:</td>
  </tr>
  <tr>
     <td>
       <label for="">nom:</label><input type="text" id="nom" required="required">
     </td>
     <td>
        <label for="">score:</label><input type="text" id="note" required>
    </td>
     <td>
        <input type="submit" id="Aj" value="ajouter">
     </td>
  </tr>
</table>

<div id="table">
  <table>
     <tr style="background: #9966ff;">
        <td>Leila</td>
        <td>17</td>
     </tr>
     <tr style="background: #CCCCFF;">
         <td>Driss</td>
         <td>18</td>
     </tr>
  </table>
</div>
    <div>
        <p>moyenne:<span id="moyenne"></span></p>
    </div>
    
Code jQuery
        
$(document).ready(function()
{
  var T;
  var r1,r2,res;
  r1 = Number($('#table tr:first-child() td:last-child()').text());
  r2 =Number($('#table tr:nth-child(2) td:last-child()').text());
  res=r1+r2;
  $('#moyenne').text(res/2); 
                                 
        // button ajouter
  $('#Aj').click(function(e)
  {
    var nom = $('#nom').val();
    var note = $('#note').val();
    if(isNaN(nom) && note >= 0 && note <= 20 )
    {
        var row = ""
                 +""+nom+""
                 +""+note+""
                 +"";
        $("#table table").append(row);
                    
        res+=Number($('#table tr:last-child() td:last-child()').text());
        $('#table table tr:nth-child(odd)').css('background','#CCCCFF');
        $('#table table tr:nth-child(even)').css('background','#9966ff');
                    
        var len = $('#table  tr').length;
        $('#moyenne').text(res/len); 
                    
    } 
    else
    {
        alert("un champ invalide");
         e.preventDefault();
    }
   });
                    
});    
                        
        
    

Telecharger code

Posts les plus consultés de ce blog

Apprendre le cours d'algorithme par des exercices corrigés

définition de l'algorithme et la relation avec programmation L'algorithme est une procédure étape par étape, qui définit un ensemble d'instructions à exécuter dans un certain ordre pour obtenir le résultat souhaité. les algorithmes sont généralement créés indépendamment des langues utilisées. un algorithme peut être exécuté dans plus d'un langage de programmation. algorithme définition Le mot "algorithme" signifie "un processus ou un ensemble des règles à suivre dans les calculs ou autres opérations de résolution de problèmes". Un algorithme désigne une liste d'instructions étape par étape pour résoudre une instance d'un problème. Les algorithmes sont des processus finis et sont des solutions en soi. On peut le comprendre en prenant un exemple de cuisson d'une nouvelle recette. Pour préparer une nouvelle recette, on lit les instructions et les étapes et on les exécute une par une, d

exercice en html et css pour les débutant avec correction N°1

É noncé: l'objectif de cet exercices est  pratiqué de ce que tu as appris déja. écrire ne code correspondant a l'image suivante : Correction Code HTML <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>CHAUSSEURS</title> </head> <body> <!--Remplissage Header --> <header> <!--changer photo sneakers.png par une photo sur votre computer--> <img src="sneakers.png"> <h2 class="Title">ShoesStore:étre bien dans ses pieds</h2> </header> <!--Remplissage Nav --> <nav> <a href="#">Accueil</a>| <a href="#">Enfants</a> <a href="#">Hommes</a> <a href="#">Femmes</a> <a href="#">Paiement</a> </nav>

Exercices Algorithme les tableaux

Les tableaux a une dimension Exercice 1: Ecrire un algorithme qui déclare et remplisse un tableau de 7 valeurs numériques en les mettant toutes à zéro. Correction Tableau Truc(6) en Numérique Variable i en Numérique Debut Pour i ← 0 à 6 Truc(i) ← 0 FinPour Fin Exercice 2: Ecrire un algorithme qui déclare et remplisse un tableau contenant les six voyelles de l’alphabet latin. Correction Tableau Truc(5) en Caractère Debut Truc(0) ← "a" Truc(1) ← "e" Truc(2) ← "i" Truc(3) ← "o" Truc(4) ← "u" Truc(5) ← "y" Fin Exercice 3: Ecrire un algorithme qui déclare un tableau de 9 notes, dont on fait ensuite saisir les valeurs par l’utilisateur. Correction Tableau Notes(8) en Numérique Variable i en Numérique Debut Pour i ← 0 à 8 Ecrire "Entrez la note numéro ", i + 1 Lire Notes(i) FinPour Fin Exercice 4: Que produit l’algorith