Lier la valeur d'une balise HTML (input , div.innerHTML, etc.) à celle d'une variable js

**Caplande** · 28/05/2015, 16h01

Bonjour,

Je ne sais pas s'il est possible de cabler une balise HTML d'affichage à l'écran (div, input, etc..), de manière qu'elle affiche la valeur d'une variable javascript,cet affichage suivant les changements de valeurs de la variable..
Merci de votre réponse.

Caplande

**NoSmoking** · 28/05/2015, 16h18

Bonjour,
l'exposé de ta question n'est pas des plus clair mais aucune raison de ne pas arriver à mettre à jour le contenu d'une balise fonction de la valeur d'une variable.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
// 1st cas SPAN par exemple
document.getElementById('id_de_la_balise').innerHTML = valeur_variable;
// 2nd cas INPUT par exemple
document.getElementById('id_de_la_balise').value = valeur_variable;

**Caplande** · 28/05/2015, 17h08

Merci pour cette réponse. Elle ne correspond malheureusement pas à ma demande, qui est certainement un peu floue.

En effet, je souhaite établir un lien UNE FOIS ET UNE SEULE entre une variable js et une balise HTML de manière telle que lorsque la variable change de valeur, la valeur affichée par la balise change en conséquence SANS AUCUNE AUTRE INSTRUCTION que celle de changement de la valeur de la variable.

**NoSmoking** · 28/05/2015, 17h32

Il n'y a pas d'opération du Saint Esprit en javascript, il te faudra bien à un moment ou à un autre faire la modification du contenu de la balise.

De quelle nature est ta variable, comment est elle modifiée, par qui et où.

Tu peux envisager de mettre un observateur sur cette variable via un setInterval par exemple.

**Bovino** · 28/05/2015, 18h17

Si tu ne recherches pas la compatibilité et que tu ne vises que Chrome (voire Opera), tu peux toujours utiliser Object.observe() :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
var obj = {
  nb: 42
};
Object.observe(obj, function(changes){
  document.getElementById('ton_element').innerHTML = obj.a;
}, ['update']);

**Caplande** · 28/05/2015, 18h20

setInterval peut apporter une réponse à ma question. Je viens de trouver une autre solution qui est la suivante et qui fonctionne:
Elle consiste à créer un objet (dans mon exemple ci-dessous: watch) qui a pour attribut la variable à observer (maVar) et une méthode (setMaVar(nlleVal)).Il suffit de s'astreindre à valoriser l'attribut maVar via la méthode setMaVar et, au travers de cette méthode tout devient possible, y compris l'actualisation de la valorisation de la valeur de la balise.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<body>
	<button onclick="clicBouton()">Cliquez moi !</button>
	<div id="monChamp"></div>
</body>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
var watch = new Object();
watch.maVar = null;
watch.setMaVar = function(nlleVal){
	this.maVar = nlleVal;
	console.log(document.getElementById('monChamp').innerHTML = nlleVal);
};
watch.setMaVar(12345);
var clicBouton = function(){
	console.log("Bouton cliqué!");
	watch.setMaVar(67895);
};

Lier la valeur d'une balise HTML (input , div.innerHTML, etc.) à celle d'une variable js

JavaScript

Vue hybride

Discussions similaires

Partager

Partager