bonjour
voila un JavaScript ,je sais pas reprendre valeur ,cliquer cliquer...
par exemple je clique
1 5 67 89 43
ben par exemple le 1 additionner au 43 ou 67 moins 5 ...
enfin c'est reprendre les valeur pour travailler avec ..
merci
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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 "use strict"; // ---------- // 0- création de la table - 90 cases let table = document.createElement('table'); let tbody = table.createTBody(); for (let row = 1; row <= 10; row++) { let tr = tbody.insertRow(); for (let col = 1; col <= 9; col++) { let key = row + ((col-1) * 10); let td = tr.insertCell(); let label = document.createElement('label'); let input = document.createElement('input'); input.type = 'checkbox'; input.name = 'cb['+key+']'; input.value = key; // on met la clé en valeur label.append(key, input); td.append(label); } } document.getElementById('form90cases').prepend(table); // insert la table dans le formulaire // ---------- // 1- checkbox let allBoxes = document.querySelectorAll('#form90cases input[type=checkbox]'); allBoxes.forEach(function(box) { box.addEventListener('click', function(){ // box.parentNode.parentNode.classList.toggle('on'); box.closest('td').classList.toggle('on'); show_results(); }); }); // ---------- // 2- Reset (Vider la grille) let btnReset = document.querySelector('#form90cases button[name="btn-reset"]'); btnReset.addEventListener('click', function(){ for (let box of allBoxes) { box.checked = false; // décoche la sélection box.removeAttribute('checked'); // décoche la sélection // box.parentNode.parentNode.classList.remove('on'); box.closest('td').classList.remove('on'); } show_results(); }); // ---------- // 3- inverser la sélection let btnInvert = document.querySelector('#form90cases button[name="btn-invert"]'); btnInvert.addEventListener('click', function(){ for (let box of allBoxes) { box.checked = !box.checked; // box.parentNode.parentNode.classList.toggle('on'); box.closest('td').classList.toggle('on'); } show_results(); }); // ---------- // 4- Envoyer let btnEnvoi = document.querySelector('#form90cases button[name="btn-envoi"]'); btnEnvoi.addEventListener('click', function(){ show_results(); }); // ---------- function show_results() { let show_results = document.getElementById('show-results'); let nbre_results = document.getElementById('nbre-results'); let results = []; let ii = 0; for (let box of allBoxes) { if( box.checked ) { results[ii] = Number(box.value); ii++; } } results.sort(compareNombres); // ordre croissant // Affichage des résultats nbre_results.textContent = ii; // show_results.textContent = results.join(', '); show_results.innerHTML = '<b>' + results.join('</b>, <b>') + '</b>'; // show_results.innerHTML = '<ul><li>' + results.join('</li><li>') + '</li></ul>'; // liste Ã* puces } function compareNombres(a, b) { return a - b; } // permet de trier correctement les nombres // ----------
Partager