JS Conversion Texte en nombre et inversement

Signaler
Messages postés
12
Date d'inscription
samedi 17 juillet 2021
Statut
Membre
Dernière intervention
25 juillet 2021
-
 Tomahawk -
Salut à tous,

Je cherche désespérément un moyen d'associer un nombre à une phrase.
ex: 1: Bonjour; 2: SVP; 3: Merci etc...
Et de me les sortir de manière aléatoire.

Pouvez-vous me donner un tuyau svp?
Je débute en JS...

Merci beaucoup,

Nirsab

11 réponses

Messages postés
16113
Date d'inscription
mardi 11 mars 2003
Statut
Contributeur
Dernière intervention
25 juillet 2021
723
Bonjour

Ton titre n’est pas très parlant, en tout cas ne fait pas penser à ta question.

Tu peux utiliser une collection de string (tableau, liste chaînée….) l’index de l’item étant ton nombre.

Je ne code pas en js mais ça devrait ressembler à
int index = 1;
string leTexte = laCollection[index];



Et pour retrouver l’index depuis le texte, je ne sais pas s’il existe des fonctions de recherche indexées en js, mais au pire tu itères la collection jusqu’à la bonne occurrence.


Tu peux aussi utiliser un enum, plus facile à passer de string en int, mais tu seras limité à un « mot »
Messages postés
12
Date d'inscription
samedi 17 juillet 2021
Statut
Membre
Dernière intervention
25 juillet 2021

Merci. C'est un début de réponse mais cela reste un peu flou pour moi... :)
Messages postés
16113
Date d'inscription
mardi 11 mars 2003
Statut
Contributeur
Dernière intervention
25 juillet 2021
723
Bonjour

Alors, je suppose que tu as fait l’erreur de la.majorité des autodidactes (moi le premier en mon temps) : te lancer comme ça dans ton projet.

Apprendre sur la tas c’est possible, à condition d’acquérir d’abord les bases.
Le meilleur conseil que je puisse te donner, c’est de mettre ton projet de côté quelques jours pour suivre un cours en ligne.

Je ne peux pas t’en proposer un spécifique puisque je ne fais pas de js, mais developpez.com est une valeur sûre
https://programmation-facile.developpez.com/tutoriels/javascript/debutez-programmation-avec-langage-javascript/
Salut, oui en effet pas de JS pour Whismerhil ;)
JS n'est pas typé.

On va décomposer la question en 2 parties:

Premièrement faire une liste de données; il y a l'objet primaire Array(oui pas de typage c'est donc possible en JavaScript, une variable peut devenir une fonction et la barrière entre une fonction et un objet est mince si ce n'est inexistante dans ce langage de script qui permet certains paradigmes impossibles dans la plupart des langages compilés -avec l'inconvénient du non typage certes).

Un tableau de valeurs est donc une variable comme une autre(pas de typage)

/** créer une variable de "type" Array plusieurs méthodes
*/
/** en pur objet */
var monTableau=new Array();

/** ou encore plus simple */
var unAutreTableau=['salut', 'SVP', "merci" ];
/* ici j'ai volontairement crée un tableau avec des contenus, créer un tableau vvide s'écrirait comme ceci:
* var encoreUnTableau=[];
* les deux méthodes sont équivalentes */

//-- Accéder à un tableau se fait en utilisant un index numérique entre crochets
//-- l'indice de départ est 0, la seconde valeur du tableau est donc repéré par l'indice/index 1
monTableau[0]="Bonjour";
//-- JS n'étant pas typé un tableau n'a aucune raison de ne pas l'être
//-- ce qui veut dire qu'on peut stocker des données de différents "types" dans un même tableau

monTableau[1]=23;
/** monTableau contient maintenant comme première une chaîne de caractères en premier indice(0) et en deuxième valeur stockée une valeur numérique*/
//-- on peut aussi y stocker des Objets de n'importe quelle sorte:

var monTableau[2]= new Array(1,2,3,4,5,6,7,8);

console.log(monTableau.toString());//-- affiche en liste de texte le contenu du tableau



Suite de l'utilisation d'un tableau:
/** Comme un tableau est un objet il a ses propres méthodes, une méthode est une fonction interne à un objet
*/

var tableauTest=[];
//-- la méthode .push va ajouter une valeur en fin de tableau
//-- Ici le tableau étant vide ce sera donc à l'indice 0
tableauTest.push('une valeur");
console.log(tableauTest[0]);

//-- la méthode .length renvoie la taille du tableau (le nombre d'éléments contenus)
console.log(tableauTest.length);//-- affiche 1 dans la console
tableauTest.push('seconde valeur');
//-- ici le paramètre est stockée en seconde position : indice 1
console.log(tableauTest.length);
/** il vaut mieux étudier les trous dans un tableau qui peuvent porter à confusion */
tableauTest[4]="troisième valeur stockée";

console.log(tableauTest.length);//-- affichera 5
/* car les espaces non remplis du tableau tableauTest[2], tableauTest[3]
prendront automatiquement une valeur nulle ( null )
*/
console.log(tableauTest.toString(" - "));
Maintenant que nous avons un tableau nous avons donc associé un indice numérique à chaque valeur stockée dans un tableau.

Il suffit donc de faire un Math.random() (la fonction pour obtenir un nombre aléatoire) sur la taille du tableau:

"use strict";
let couleurs = [],
     resultat;
couleurs.push("rouge");
couleurs.push("vert");
couleurs.push("bleu");
couleurs.push("cyan");
couleurs.push("jaune");

//-- 5 valeurs sont stockées donc de l'indice 0 à l'indice 4
//-- pour vérification:
console.log(couleurs.toString(' \n* '));

resultat= Math.floor( Math.random()*couleurs.length) );

alert('Une couleur au hasard : le '+resultat);


Explications détaillées:
l'objet Array
https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Global_Objects/Array

la méthode Math.random():
https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Global_Objects/Math/random

On peut aussi utiliser un autre type d'éléments de stockage qu'un tableau(Array).
Le tableau reste la solution la plus simple, tout dépends donc de la finalité et de la façon d'utiliser.

Par exemple avec les objets Set ou Map peuvent aussi utiliser un index numérique(ou ce qu'on veut en fait):

/** avec Map*/
let maMap= new Map();
maMap.set(1,'bonjour');
maMap.set(2,'SVP');
maMap.set(3,'merci');

let hasard= Math.floor( Math.random()*maMap.size());
//-- remarquez que la méthode Map.size() remplace Array.length

console.log('au hasard parmi 3 possibilités: '+maMap.get(hasard));
/**  et bien sûr accéder au valeurs stockées à sa propre méthode avec Map, c'est .get(indice)
*/



Pour l'objet Map c'est pas le plus pratique mais bon à connaître pour faire tout un tas de chose qu'un tableau Array ne peut pas faire, comme un tableau associatif qui n'utilise pas d'indes numérique:

const AUREVOIR="AUREVOIR"
var map=new Map()
map.set("salut"," mon beau");
map.set("direSVP",function(nom){console.log("SVP "+nom);});
map.set("merci"," JavaScript");
map.set(AUREVOIR, function(nom){ return "au revoir "+nom});


console.log(getmap.get("salut"));//-- affiche "mon beau"
map.get("direSVP")("bob");//-- affiche "SVP bob"
map.get(AUREVOIR)("momo");//-- affiche "au revoir momo"


Et bien sûr encore plus la classe en stockage un objet "Object"
en écriture littérale/notation JSON mais on s'éloigne du sujet:

let unObjet={
 tableau:['a','b','c'],
 ajouterAuTableau: function(val){ this.tableau.push(val);},
 auHasardDansTableau=function(){
      return this.tableau[ Math.floor( Math.random()*this.tableau.length)  )];
      }

}

unObjet.ajouterAuTableau('d');

console.log(unObjet.auHasardDansTableau());


Encore une fois le non typage et quelques autres des particularités de JavaScript qui en font sa faiblesse par rapport à des langages plus structurés(ce qui oblige à devoir vérifier les types des données) ajoute une souplesse et des possibilités(closure et proximité des fonctions avec l'objet, en fait Function hérite d'Object dont une fonction est un objet en JS, objet primaire ou first class object tout comme Array, String, etc...).
Messages postés
12
Date d'inscription
samedi 17 juillet 2021
Statut
Membre
Dernière intervention
25 juillet 2021

Wouah, merci d'avoir pris le temps d'écrire tout ça...

Typiquement, si je souhaite générer une question aléatoire et affecter à une question une valeur de point (façon questions pour un champion), comment dois-je procéder, stp ?
Sachant que la question s'affiche lorsque je clique sur un bouton:

<button class="question" value= "aleatoire" style="background-color:white">Question</button>

et le js actuel ressemble à ça (c'est un ami qui m'a aidé pour ce code, big up)
$(document).ready(function (){



$('.compteur').on('click', function (e) { e.preventDefault();
$val = $(this).attr('value').split('|');
$champ = '#compteur' + $val[0];
$new_score = parseInt($($champ).text()) + parseInt($val[1])
if ($new_score <= 10) {
$('#compteur' + $val[0]).text($new_score);
} else {
$('#compteur' + $val[0]).text('ÉQUIPE QUALIFIÉE');
}

});
Messages postés
16113
Date d'inscription
mardi 11 mars 2003
Statut
Contributeur
Dernière intervention
25 juillet 2021
723
Non seulement thomahawk a pris le,temps,d’écrire tout mais il a fait l’effort de présenter son code en couleur.
Voir ce court tuto sur l’utilisation des balises de code https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code
Messages postés
12
Date d'inscription
samedi 17 juillet 2021
Statut
Membre
Dernière intervention
25 juillet 2021

J'ai un soucis, j'ai dû effacer un truc qu'il ne fallait pas... Cela ne fonctionne plus.... :'C

<h1> 11 POINTS GAGNANTS </h1>


<button class="question" value= "aleatoire" style="background-color:white">Question</button>


<form>

<div class="row">
<div class="col">

<div class="form-group">
<label for="equipe1">Équipe 1:</label>
</div>

<div class="form-group">
<label for="compteur1">SCORE:</label>
<div class="col-sm-2">
<span id="compteur1"><b>0</b></span>
</div>
</div>

<div>
<button class="compteur" value="1|1" style="background-color:green">+1</button>
<button class="compteur" value="1|2" style="background-color:orange">+2</button>
<button class="compteur" value="1|3" style="background-color:red">+3</button>
<button class="compteur" value="1|-2" style="background-color:gray">-2</button>
</div>
</div>


<div class="col">

<div class="form-group">
<label for="equipe2">Équipe 2:</label>
</div>

<div class="form-group">
<label for="compteur2">SCORE:</label>
<div class="col-sm-2">
<span id="compteur2"><b>0</b></span>
</div>
</div>

<div>
<button class="compteur" value="2|1" style="background-color:green">+1</button>
<button class="compteur" value="2|2" style="background-color:orange">+2</button>
<button class="compteur" value="2|3" style="background-color:red">+3</button>
<button class="compteur" value="2|-2" style="background-color:gray">-2</button>
</div>

</div>
</div>
<br><br>

<div class="row">
<div class="col">

<div class="form-group">
<label for="equipe3">Équipe 3:</label>
</div>

<div class="form-group">
<label for="compteur3">SCORE:</label>
<div class="col-sm-2">
<span id="compteur3"><b>0</b></span>
</div>
</div>

<div>
<button class="compteur" value="3|1" style="background-color:green">+1</button>
<button class="compteur" value="3|2" style="background-color:orange">+2</button>
<button class="compteur" value="3|3" style="background-color:red">+3</button>
<button class="compteur" value="3|-2" style="background-color:gray">-2</button>
</div>
</div>


<div class="col">

<div class="form-group">
<label for="equipe4">Équipe 4:</label>
</div>

<div class="form-group">
<label for="compteur4">SCORE:</label>
<div class="col-sm-2">
<span id="compteur4"><b>0</b></span>
</div>
</div>

<div>
<button class="compteur" value="4|1" style="background-color:green">+1</button>
<button class="compteur" value="4|2" style="background-color:orange">+2</button>
<button class="compteur" value="4|3" style="background-color:red">+3</button>
<button class="compteur" value="4|-2" style="background-color:gray">-2</button>
</div>
</div>

</div>



</form>
</div>

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script>
$(document).ready(function (){



$('.compteur').on('click', function (e) { e.preventDefault();
$val = $(this).attr('value').split('|');
$champ = '#compteur' + $val[0];
$new_score = parseInt($($champ).text()) + parseInt($val[1])
if ($new_score <= 10) {
$('#compteur' + $val[0]).text($new_score);
} else {
$('#compteur' + $val[0]).text('ÉQUIPE QUALIFIÉE');
}

});
Messages postés
33134
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
26 juillet 2021
3 636
Voir ce court tuto sur l’utilisation des balises de code https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code

Surtout qu'en plus, tu sembles avoir oublié une partie du code....
Il faudrait nous poster le code COMPLET..

Ensuite, regarde dans la console de ton navigateur si il n'y a pas des messages d'erreurs ...
Messages postés
12
Date d'inscription
samedi 17 juillet 2021
Statut
Membre
Dernière intervention
25 juillet 2021
>
Messages postés
33134
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
26 juillet 2021

<!DOCTYPE html>
<html>
<head>
<title>Questions pour un Champion</title>
<meta charset="utf-8">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.min.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css">
<link href='QPUC.css' rel='stylesheet' type='text/css'>
</head>
<body>
<div class="container">

<h1> 11 POINTS GAGNANTS </h1>


<button class="question" value= "aleatoire" style="background-color:white">Question</button>


<form>

<div class="row">
<div class="col">

<div class="form-group">
<label for="equipe1">Équipe 1:</label>
</div>

<div class="form-group">
<label for="compteur1">SCORE:</label>
<div class="col-sm-2">
<span id="compteur1"><b>0</b></span>
</div>
</div>

<div>
<button class="compteur" value="1|1" style="background-color:green">+1</button>
<button class="compteur" value="1|2" style="background-color:orange">+2</button>
<button class="compteur" value="1|3" style="background-color:red">+3</button>
<button class="compteur" value="1|-2" style="background-color:gray">-2</button>
</div>
</div>


<div class="col">

<div class="form-group">
<label for="equipe2">Équipe 2:</label>
</div>

<div class="form-group">
<label for="compteur2">SCORE:</label>
<div class="col-sm-2">
<span id="compteur2"><b>0</b></span>
</div>
</div>

<div>
<button class="compteur" value="2|1" style="background-color:green">+1</button>
<button class="compteur" value="2|2" style="background-color:orange">+2</button>
<button class="compteur" value="2|3" style="background-color:red">+3</button>
<button class="compteur" value="2|-2" style="background-color:gray">-2</button>
</div>

</div>
</div>
<br><br>

<div class="row">
<div class="col">

<div class="form-group">
<label for="equipe3">Équipe 3:</label>
</div>

<div class="form-group">
<label for="compteur3">SCORE:</label>
<div class="col-sm-2">
<span id="compteur3"><b>0</b></span>
</div>
</div>

<div>
<button class="compteur" value="3|1" style="background-color:green">+1</button>
<button class="compteur" value="3|2" style="background-color:orange">+2</button>
<button class="compteur" value="3|3" style="background-color:red">+3</button>
<button class="compteur" value="3|-2" style="background-color:gray">-2</button>
</div>
</div>


<div class="col">

<div class="form-group">
<label for="equipe4">Équipe 4:</label>
</div>

<div class="form-group">
<label for="compteur4">SCORE:</label>
<div class="col-sm-2">
<span id="compteur4"><b>0</b></span>
</div>
</div>

<div>
<button class="compteur" value="4|1" style="background-color:green">+1</button>
<button class="compteur" value="4|2" style="background-color:orange">+2</button>
<button class="compteur" value="4|3" style="background-color:red">+3</button>
<button class="compteur" value="4|-2" style="background-color:gray">-2</button>
</div>
</div>

</div>



<!--Les 3 premiers à 11 points, 4 à la suite; Afficher équipes qualifiées-->
<button type="button" style="background-color:gold">Aller 4 à la Suite</button>












</form>
</div>

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script>
$(document).ready(function (){



$('.compteur').on('click', function (e) { e.preventDefault();
$val = $(this).attr('value').split('|');
$champ = '#compteur' + $val[0];
$new_score = parseInt($($champ).text()) + parseInt($val[1])
if ($new_score <= 10) {
$('#compteur' + $val[0]).text($new_score);
} else {
$('#compteur' + $val[0]).text('ÉQUIPE QUALIFIÉE');
}

});


</script>



</body>
</html>
Messages postés
16113
Date d'inscription
mardi 11 mars 2003
Statut
Contributeur
Dernière intervention
25 juillet 2021
723 >
Messages postés
12
Date d'inscription
samedi 17 juillet 2021
Statut
Membre
Dernière intervention
25 juillet 2021

Je t'ai mis le lien vers le tuto sur les balises de codes, tu as ensuite posté un code sans, Jordane te la remis et tu repostes sans.

C'est clairement manquer de respect envers les efforts que thomahawk a fait pour toi.
Messages postés
33134
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
26 juillet 2021
3 636 >
Messages postés
12
Date d'inscription
samedi 17 juillet 2021
Statut
Membre
Dernière intervention
25 juillet 2021

Comme cela t'a été rappellé par Whisméril et moi même ....

Merci de reposter ton code en utilisant les BALISES DE CODE !!!!!

Explications ( à lire ENTIEREMENT! !!!! ) disponibles ici :
https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code
Messages postés
12
Date d'inscription
samedi 17 juillet 2021
Statut
Membre
Dernière intervention
25 juillet 2021

Ce n'est pas mon intention.
Je cherchais juste à comprendre pourquoi mon code ne fonctionnait plus...
Je suis débutant complet en la matière.
Si j'ai pu offenser qui que soit, je m'en excuse.
L'exemple de thomahawk m'est très précieux mais d'abord, je souhaite régler ce que j'ai déja fait.


<!DOCTYPE html>
<html>
<head>
<title>Questions pour un Champion</title>
<meta charset="utf-8">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.min.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css">
<link href='QPUC.css' rel='stylesheet' type='text/css'>
</head>
<body>
<div class="container">

<h1> 11 POINTS GAGNANTS </h1>


<button class="question" value= "aleatoire" style="background-color:white">Question</button>


<form>

<div class="row">
<div class="col">

<div class="form-group">
<label for="equipe1">Équipe 1:</label>
</div>

<div class="form-group">
<label for="compteur1">SCORE:</label>
<div class="col-sm-2">
<span id="compteur1"><b>0</b></span>
</div>
</div>

<div>
<button class="compteur" value="1|1" style="background-color:green">+1</button>
<button class="compteur" value="1|2" style="background-color:orange">+2</button>
<button class="compteur" value="1|3" style="background-color:red">+3</button>
<button class="compteur" value="1|-2" style="background-color:gray">-2</button>
</div>
</div>


<div class="col">

<div class="form-group">
<label for="equipe2">Équipe 2:</label>
</div>

<div class="form-group">
<label for="compteur2">SCORE:</label>
<div class="col-sm-2">
<span id="compteur2"><b>0</b></span>
</div>
</div>

<div>
<button class="compteur" value="2|1" style="background-color:green">+1</button>
<button class="compteur" value="2|2" style="background-color:orange">+2</button>
<button class="compteur" value="2|3" style="background-color:red">+3</button>
<button class="compteur" value="2|-2" style="background-color:gray">-2</button>
</div>

</div>
</div>
<br><br>

<div class="row">
<div class="col">

<div class="form-group">
<label for="equipe3">Équipe 3:</label>
</div>

<div class="form-group">
<label for="compteur3">SCORE:</label>
<div class="col-sm-2">
<span id="compteur3"><b>0</b></span>
</div>
</div>

<div>
<button class="compteur" value="3|1" style="background-color:green">+1</button>
<button class="compteur" value="3|2" style="background-color:orange">+2</button>
<button class="compteur" value="3|3" style="background-color:red">+3</button>
<button class="compteur" value="3|-2" style="background-color:gray">-2</button>
</div>
</div>


<div class="col">

<div class="form-group">
<label for="equipe4">Équipe 4:</label>
</div>

<div class="form-group">
<label for="compteur4">SCORE:</label>
<div class="col-sm-2">
<span id="compteur4"><b>0</b></span>
</div>
</div>

<div>
<button class="compteur" value="4|1" style="background-color:green">+1</button>
<button class="compteur" value="4|2" style="background-color:orange">+2</button>
<button class="compteur" value="4|3" style="background-color:red">+3</button>
<button class="compteur" value="4|-2" style="background-color:gray">-2</button>
</div>
</div>

</div>



<!--Les 3 premiers à 11 points, 4 à la suite; Afficher équipes qualifiées-->
<button type="button" style="background-color:gold">Aller 4 à la Suite</button>












</form>
</div>

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script>
$(document).ready(function (){



$('.compteur').on('click', function (e) { e.preventDefault();
$val = $(this).attr('value').split('|');
$champ = '#compteur' + $val[0];
$new_score = parseInt($($champ).text()) + parseInt($val[1])
if ($new_score <= 10) {
$('#compteur' + $val[0]).text($new_score);
} else {
$('#compteur' + $val[0]).text('ÉQUIPE QUALIFIÉE');
}

});


</script>



</body>
</html>



J'ai suivi le tuto, j'espère que c'est juste, maintenant...
Messages postés
12
Date d'inscription
samedi 17 juillet 2021
Statut
Membre
Dernière intervention
25 juillet 2021

Je suis désolé, je sais que j'ai un foutu handicap qui m'empêche de tout comprendre du premier coup, que je suis débutant complet en programmation et que je cherche des astuces: j'ai suivi le tuto, je ne parviens pas à trouver ce qui cloche...
Et je l'a lu entièrement...
Alors, si vous êtes un minimum humain, merci de me traiter comme tel, et de m'expliquer ce qui cloche en évitant de me balancer des tutos très intéressants, sans me dire où cela coince...


D'autant que ma question de base, c'est "pourquoi mon code ne fonctionne plus, alors que je n'avais pas de soucis avant"...
J'ai dû effacer un truc par mégarde et je ne vois pas quoi....
Pourquoi vous me prenez la tête avec des balises de codes?...
Vous faites copier/coller dans NotePad et basta...
Dans mon navigateur, je ne trouve pas ce qui coince....


Je suis sûr que vous êtes aussi passés par une phase d'apprentissage, et je doute que l'on vous ait traité comme un chien, histoire de vous encourager dans vos progrès...

Donc, soit vous m'expliquez correctement et patiemment les choses, soit je mets fin à ce forum et tant pis pour moi, je me coucherais toujours aussi con ce soir et je finirais mon programme dans 20 ans au lieu de le finir dans 2 mois...

Merci à vous,
Messages postés
33134
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
26 juillet 2021
3 636
En indentant correctement ton code, on voit qu'il manque une accolade et une parenthèse à la fin de ton script.

A corriger par:
$(document).ready(function (){
  $('.compteur').on('click', function (e) {
    e.preventDefault();
    $val = $(this).attr('value').split('|');
    $champ = '#compteur' + $val[0];
    $new_score = parseInt($($champ).text()) + parseInt($val[1])
    if ($new_score <= 10) {
      $('#compteur' + $val[0]).text($new_score);
    } else {
      $('#compteur' + $val[0]).text('ÉQUIPE QUALIFIÉE');
    }
  });
});


Messages postés
12
Date d'inscription
samedi 17 juillet 2021
Statut
Membre
Dernière intervention
25 juillet 2021

Merciiiiiiii !!

Maintenant,

j'aimerais corriger cette ligne:

<button class="question" value= "question_11pts" onClick=Math.random(question_11pts) style="background-color:white">Question</button>



J'ai initialisé mon tableau ainsi:


var question_11pts = [];
    question_11pts [0]= 'Question 1','1 point';
    question_11pts [1]= 'Question 2','2 points'; //etc...//




Si je souhaite faire en sorte que les questions s'affichent de manière aléatoire avec la valeur du nombre de point (à coté du bouton, pas de popup si possible) en cliquant sur le bouton, comment dois-je corriger la ligne ci-dessus, svp ?
D'autant que j'aimerais également ajouter un compte à rebours dès que la question s'affiche, et afficher la réponse aubout de ce même compte...
Est-ce possible ? Si oui, comment ?

(vous remarquerez que j'ai mis les balises de code...)

Merci à vous,
Messages postés
33134
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
26 juillet 2021
3 636
Whismeril 723
19 juil. 2021 à 16:10
Bonjour

Alors, je suppose que tu as fait l’erreur de la.majorité des autodidactes (moi le premier en mon temps) : te lancer comme ça dans ton projet.

Apprendre sur la tas c’est possible, à condition d’acquérir d’abord les bases.
Le meilleur conseil que je puisse te donner, c’est de mettre ton projet de côté quelques jours pour suivre un cours en ligne.

Je ne peux pas t’en proposer un spécifique puisque je ne fais pas de js, mais developpez.com est une valeur sûre
https://programmation-facile.developpez.com/tutoriels/javascript/debutez-programmation-avec-langage-javascript/
> Tomahawk
Explications détaillées:
l'objet Array
https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Global_Objects/Array

la méthode Math.random():
https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Global_Objects/Math/random