voila le code de la calculatrice que j'ai codé avec html css et javascript et qui fonctionne seulement sur mon windows pas sur mon tele svp aider moi pour faire marcher ce code sur mon mobile j'ai galaxy J3 2016

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8"/>
        <title>Calculatrice</title>
        <link rel="stylesheet" href="style.css"/>
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    </head>

    <body>
      <div class="calc">
          <div id="ecran"></div>
          <div id="boutons">
          <div id="delete">C</div>
          <div id="supprimer">← </div>
          <div class="bouton">(</div>
          <div class="bouton">)</div>
          <div class="bouton">1</div>
          <div class="bouton">2</div>
          <div class="bouton">3</div>
          <div class="bouton">4</div>
          <div class="bouton">5</div>
          <div class="bouton">6</div>
          <div class="bouton">7</div>
          <div class="bouton">8</div>
          <div class="bouton">9</div>
          <div class="bouton">0</div>
          <div class="bouton">*</div>
          <div class="bouton">/</div>
          <div class="bouton">+</div>
          <div class="bouton">-</div>
          <div class="bouton">.</div>
          <div id="egal">=</div>
        </div>
      </div>
      
      <script src="app.js"></script>
    </body>
</html>

#ecran
{
  width: 300px;
  background: rgb(255,255,255);
  height: 100px;
  display: table-cell;
  border-radius: 10px;
  font-size: 1.9em;
  text-align: center;
  vertical-align: middle;
  font-weight: bold;
  max-width: 300px;
  word-wrap: break-word;
}

#boutons
{
  width: 300px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  margin-top: 13px;
}

.bouton
{
  color: black;
  padding: 10px;
  font-size: 1.9em;
  margin: 9px;
  cursor: pointer;
  background: white;
  border-radius: 10px;
  font-weight: bold;
  width: 25px;
  text-align: center;
}

#egal
{
  color: white;
  padding: 10px;
  font-size: 1.9em;
  margin: 10px;
  cursor: pointer;
  background: green;
  border-radius: 10px;
  font-weight: bold;
  width: 25px;
  text-align: center;
}

.calc
{
  width: 300px;
  margin: auto;
  padding: 7px;
  background: black;
  border-radius: 10px;
  box-shadow: 0 5px black;
}

.bouton:hover
{
  box-shadow: 5px 5px 5px black;
  transform: translateY(2px);
}


#egal:hover
{
  box-shadow: 5px 5px 5px black;
  transform: translateY(2px);
}

body
{
  display: flex;
  justify-content: center;
  background-image: linear-gradient(to top, #a18cd1 0%, #fbc2eb 100%);
}

#delete
{
  color: black;
  padding: 10px;
  font-size: 1.9em;
  margin: 10px;
  cursor: pointer;
  background: rgb(255,184,113);
  border-radius: 10px;
  text-align: center;
  width: 25px;
}
a
{
text-decoration: none;
color: black;
}
#delete:hover,#supprimer:hover
{
  box-shadow: 5px 5px 5px black;
  transform: translateY(2px);
}

#supprimer
{
  color: black;
  padding: 10px;
  font-size: 1.9em;
  margin: 10px;
  cursor: pointer;
  background: rgb(255,184,113);
  border-radius: 10px;
  width: 25px;
}

let elt=document.getElementById('ecran');
let elt2=document.getElementById('egal');
let elt3=document.getElementById('supprimer');
var i=0;
for(i=0;i<17;i++)
{
    document.getElementsByClassName('bouton')[i].addEventListener('click',function(e){
        e = e || window.event;
        var target=e.target || e.srcElement;
        elt.innerText+=target.innerText || target.textContent;
        });
}

document.getElementById('delete').addEventListener('click',function (){
    elt.textContent="";
});


elt2.addEventListener('click',function(){
    const calcul=eval(elt.textContent);
    elt.textContent=calcul;
});


elt3.addEventListener('click',function(){
    var long=elt.textContent.length;
    var newchaine=elt.textContent.slice(0,(long-1));
    elt.textContent=newchaine;
});

-
Edité par Mohamed Knoud 29 novembre 2021 à 21:11:55

Bonjour,

Mauvais titre

Le titre est un élément important qui ne doit pas être négligé. N'oubliez pas cette règle simple : le titre idéal résume la question que vous allez poser en une petite phrase. Il doit permettre aux visiteurs de se repérer facilement dans le forum visité et d'identifier le sujet à sa seule lecture.

Vous pouvez utiliser divers préfixes comme [Erreur], [MySQL], [Compatibilité], etc... Aussi, pensez à consulter les règles propres à chaque forum (visibles dans les topics épinglés en haut des sections).

De plus, choisir un bon titre permet de rendre plus faciles les recherches des autres membres.

Les titres de type "besoin d'aide" ou "problème" ne sont pas tolérés.

Merci de modifier votre titre. Pour cela, éditez le premier message de votre sujet.

(titre originel : calculatrice html css javascript)

Mohamed Knoud

27 novembre 2021 à 17:47:51

zvheer

27 novembre 2021 à 18:59:43

Si le code marche sur un appareil mais pas un autre regarder la documentation des fonctions que vous avez utilisé pour voir la compatibilité

yasakani no magatama

Domi65

28 novembre 2021 à 15:04:11

Un truc m'a fait tiquer :

const calcul=eval(elt.textContent);

Normalement, on n'utilise plus eval()

Il est fort possible que la politique de sécurité du navigateur de ton galaxie interdise l'utilisation de eval qui constitue un gros trou de sécurité.

Eval sur MDN (et alternatives)