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 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141
| <!DOCTYPE html>
<html lang="fr" dir="ltr">
<head>
<!-- cache-control avec max-age=60 pour le développement uniquement -->
<meta http-equiv="cache-control" content="public, max-age=60">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<meta name="author" content="Daniel Hagnoul">
<title>Test</title>
<style>
*,
*:after,
*:before {
box-sizing: border-box;
}
/* CSS du test */
#questions {
width: 20rem;
}
th, td {
padding: 0.3rem;
border: 1pt dotted lightgrey;
}
/* Fin CSS du test */
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.20.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.20.1/locale/fr.js"></script>
<script src="http://danielhagnoul.developpez.com/lib/dvjh/dvjhUtilities-1.5.0.js"></script>
<script>
'use strict';
document.addEventListener( "DOMContentLoaded", ev => {
// le DOM est construit, la page web n'est pas visible
moment.locale( "fr" );
klog( `DOM ready : ${ new kDvjhDate() }` );
// code du test
// fin code du test
}, false );
window.addEventListener( "load", ev => {
// le DOM est construit et la page web est visible
klog( `Window load : ${ new kDvjhDate() }` );
// code du test
const
elemSelects = Array.from( document.querySelectorAll( "select[name^='Choix']" ) ),
elemBtnValider = document.querySelector( "#btnValider" ),
elemResult = document.querySelector( "#result" );
elemBtnValider.addEventListener( "click", ev => {
let result = 0;
for ( const elem of elemSelects ){
if ( elem.value !== "--Choisir--" ){
result += parseInt( elem.value, 10 );
}
}
if ( result > 8 ){
elemResult.value = `Great ! ( ${result} )`;
}
if ( result < 8 ){
elemResult.value = `Peut mieux faire ( ${result} )`;
}
}, false );
// fin code du test
kIDUnique();
}, false );
</script>
</head>
<body>
<main>
<div id="questions">
<table>
<thead>
<tr>
<th align="left">CRITERES</th>
<th>CHOIX</th>
</tr>
</thead>
<tbody>
<td>Niveau anglais</td>
<td>
<select name="Choix" size="1">
<option>--Choisir--</option>
<option value="0">Jamais pratiqué</option>
<option value="1">Faible</option>
<option value="6">Moyen</option>
<option value="9">Pro</option>
</select>
</td>
</tr>
<tr>
<td>Projet</td>
<td>
<select name="Choix1" size="1">
<option>--Choisir--</option>
<option value="0">Non effectué</option>
<option value="2">Effectué</option>
</select>
</td>
</tr>
<tr>
<td>Participation projet</td>
<td>
<select name="Choix2" size="1">
<option>--Choisir--</option>
<option value="0">Non</option>
<option value="1">3pers</option>
<option value="3">2pers</option>
<option value="6">1pers</option>
</select>
</td>
</tr>
</tbody>
</table>
<fieldset>
<legend>Résultats : </legend>
<button id="btnValider">Valider</button>
<output id="result"></output>
</fieldset>
</div>
</main>
</body>
</html> |
Partager