Action javascript au choix dans une liste html

Version imprimable

bonjour (et bon confinement...craquez pas!)
j'ai un problème de noobs dans une fonction javascript, je veux simplement que lorsque je choisi une phrase dans une liste "form-select-option", javascript remplisse un paragraphe qu'il y a en dessous du formulaire... simple pour vous, une horreur pour moi...

Code:

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
<DOCTYPE html>
<html lang="fr">
<head>
<meta charset ="utf-8"/>
 
<link/>
</head>
<body>
 
<script type="text/javascript">
 
function ddt(){
        let somme = document.getElementById('calcul');
 
        if (somme = "1/2"){
                document.getElementById('result').innerText = "0.5";
        }
        else if (somme = "1/3"){
                document.getElementById('result').innerText = "0.33";
        }
        else{
                document.getElementById('result').innerText = "0.25";
        }
}
</script>
<h1> ESSAI </h1>
<p> Essai sur l'action d'une liste en Javascript</p>
<form id="form1">
<select name="calcul" id="calcul" type="text" onChange="ddt()">
<option>1/2</option>
<option>1/3</option>
<option>1/4</option>
</select>
</form>
<p id="result"></p>
</body>
</html>

au secours !!! help me !!!I'm drowning!!!

Bonjour,

Code:

1
2
3
4
5
6
7
8
9
      <form id="form1">
        <select name="calcul" id="calcul">
          <option value="">choisissez</option>
          <option value="0.5">1/2</option>
          <option value="0.33">1/3</option>
          <option value="0.25">1/4</option>
        </select>
      </form>
      <p id="result"></p>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
"use strict"; // permet d afficher les erreurs JS -> et donc de les CORRIGER
// Quand le DOM est complementent chargé :
window.addEventListener("DOMContentLoaded", (event) => {
 
  const select_calcul = document.querySelector('#calcul');
  const div_result = document.querySelector('#result');
 
  select_calcul.addEventListener('change', function(){
    let somme = this.value; // valeur de l option choisie
    if( somme != '' )
    {
      div_result.textContent = parseFloat(somme);
    } else {
      div_result.textContent = '';
    }
  });
 
});

Bref, draeni31, tes options n'avaient pas d'attribut "value", ce qui est gênant;
tu confondais l'opérateur d'affectation "=" avec l'opérateur de comparaison "==";
tu utilisais la préhistorique propriété innerText made in IE...

Alternative à l'excellente proposition de jreaux62:
Code:

1 2 3 4 5 window.addEventListener("DOMContentLoaded", () => { document.getElementById("calcul").addEventListener("change", e => { document.getElementById("result").textContent = e.target.value || "rien" }) })