InnerHtml无效的Javascript变量

时间:2016-04-27 17:27:38

标签: javascript html if-statement operators innerhtml

我正在编写一个游戏并且在游戏中当你死的时候我想要一个特定的游戏文本根据得分使用innerHTLM显示,如果是/否则

我遵循了一些措施,但它似乎没有用,也不知道为什么。

以下是代码:

<div id="game-over">
      <h3><font color="orange">Tu as courus <span id="score"></span> mètres.</font></h3>
      <font color="orange"><h1 id="customegotext">Error text not found</h1></font>
      <a href="javascript:void(0)" class="button restart">Ressayer ?</a>
    </div>
  </div>
  <script>
    var scoretext;
    if ("score" < 45) {
        scoretext = "Text1";
    } else if ("score" > 100 ) {
        scoretext = "Text2";
    } else if ("score" > 500 ) {
        scoretext = "Text3";
    } else if ("score" > 750 ) {
        scoretext = "Text4";
    }
    document.getElementById("customegotext").innerHTML = scoretext;
</script>

更多详情:

  • 变量&#34;得分&#34;是这个代码行中index.html(存在错误的文件)中指定的单独.js文件中的计算器

<script type="text/javascript" src="ljdm.js"></script>

  • 游戏完美无缺(.html,.js和.css与代码正确相关)

  • 我是编程的初学者

感谢您的帮助!

编辑:这是游戏的完整代码。

Index.html:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>LE JEU DES MANDARINES</title>
  <link rel="stylesheet" href="ljdm.css" type="text/css" media="screen">
  <script type="text/javascript" src="jquery.2.1.1.min.js"></script>
</head>
<body>
  <div class="wrapper">
    <div class="sound sound-off"></div>
    <div id="menu">
      <div id="progress">
        <div id="percent">Téléchargement: <span id="p"></span></div>
        <progress id="progress-bar" value="0"></progress>
      </div>
      <div id="main">
        <h1>LE JEU DES MANDARINES</h1>
        <ul>
          <li><a href="javascript:void(0)" class="button play">JOUER</a></li>
          <li><a href="javascript:void(0)" class="button credits">Les Credits</a></li>
          <li><a href="javascript:void(0)" class="button howto">Comment Jouer</a></li>
        </ul>
      </div>
      <div id="credits">
        <ul>
        <li class="maincredits">Inspiration Première/Vidéo des Mandarines/Notre Maître a tous : <a href="https://www.youtube.com/user/legrandjd" target="_blank">LeGrandJD</a></li>
        <li class="maincredits">Chef de projet/Idée du Jeu : <a href="https://twitter.com/k0spwn/" target="_blank">k0spwn</a></li>
        <li class="maincredits">Graphiste : <a href="https://twitter.com/seveko00" target="_blank">Seko00</a></li>
        </ul>
        <ul>
          <li class="artwork">Inspiration Première/Vidéo des Mandarines/Notre Maître a tous : <a href="https://www.youtube.com/user/legrandjd" target="_blank">LeGrandJD</a></li>
          <li class="artwork">Character design and art: <a href="https://www.youtube.com/user/legrandjd">LeGrandJD ( Julien Donzé )</a></li>
          <li class="artwork">Animation du personnage : Seko00</li>
          <li class="artwork">Les Plateformes: Seko00</li>
        </ul> 
        <ul>
          <li class="music">La Musique: <a href="https://www.youtube.com/watch?v=aHrc_F8xMXE" target="_blank">LeGrandJD ( Julien Donzé )</a></li>
          <li class="music">Jump sound effect: <a href="http://opengameart.org/content/platformer-jumping-sounds" target="_blank">dklon</a></li>
          <li class="music">Game over music: <a href="https://twitter.com/k0spwn/" target="_blank">k0spwn</a></li>
        </ul>
        <ul>
          <li class="developer">Developeurs : <a href="https://twitter.com/k0spwn/" target="_blank">k0spwn</a> et <a href="https://twitter.com/seveko00" target="_blank">Seko00</a></li>
          <li class="developer">Developeur de la base Javascript/CSS : <a href="http://blog.sklambert.com/" target="_blank">Steven Lambert</a></li>
        </ul>
          <li class="addcredits">Remerciements : <br>- Etienne LAZURE <br>- Jimmy VALECILLOS <br>- Paul ALEXANDROPOULOS <br>- LeGrandJD ( Evidemment ) <br>- La 11VP2 ( Pour nous avoir laissez travaillé en paix)</li>
        <ul>
        </ul>
        <a href="javascript:void(0)" class="button back">Retour au jeu</a>
      </div>
      <div id="howto">
         <ul>
            <h2><font color="blue">Réfere toi a ce magnifique dessin pour apprendre a jouer:</font><h2>
         </ul>   
        <a href="javascript:void(0)" class="button back">Retour au jeu</a>
      </div>
    </div>
    <canvas id="canvas" width="800" height="480">
      <p>Ton naviguateur Internet n'a pas les fonctionnalitée requise pour jouer a ce jeu</p>
      <p>Veuillez télécharger un naviguateur plus récent comme <a href="www.google.com/chrome/‎">Google Chrome</a> pour pouvoir jouer</p>
    </canvas>
    <div id="game-over">
      <h3><font color="orange">Tu as courus <span id="score"></span> mètres.</font></h3>
      <font color="orange"><h1 id="customegotext">Error text not found</h1></font>
      <a href="javascript:void(0)" class="button restart">Ressayer ?</a>
    </div>
  </div>
  <script>
    var scoretext;
    if (score > 0) {
    scoretext = "Text1";
} 

if (score > 45 ) {
    scoretext = "Text2";
}

if (score > 100 ) {
    scoretext = "Text2";
}

if (score > 500 ) {
    scoretext = "Text3";
}

if (score > 750 ) {
    scoretext = "Text4";
}
    document.getElementById("customegotext").innerHTML = scoretext;
</script>
  <script type="text/javascript" src="ljdm.js"></script>
</body>
</html>

所有与.js文件中的分数一起使用的代码:

function gameOver() {
  stop = true;
  $('#score').html(score);
  $('#game-over').show();
  assetLoader.sounds.bg.pause();
  assetLoader.sounds.gameOver.currentTime = 0;
  assetLoader.sounds.gameOver.play();



 // draw the score
    ctx.font = '15pt Calibri';
    ctx.fillStyle = 'red';
    ctx.fillText('Score: ' + score + 'm', canvas.width - 450, 50);

3 个答案:

答案 0 :(得分:4)

如果&#34;得分&#34;是一个变量,你应该使用变量score,而不是字符串。

所以,像

var scoretext;
if (score < 45) {
    scoretext = "Text1";
} else if (score > 100 ) {
    scoretext = "Text2";
} else if (score > 500 ) {
    scoretext = "Text3";
} else if (score > 750 ) {
    scoretext = "Text4";
}
document.getElementById("customegotext").innerHTML = scoretext;

尽管如此,在执行此代码的问题中还不清楚。如果在游戏结束后使用ajax / dynamic html将其添加到页面中,它可能会起作用,否则需要触发代码才能运行。

另外,关于文本的其他内容,您可能需要撤消if语句或删除其他内容。

if (score < 45) {
    scoretext = "Text1";
} 

if (score > 100 ) {
    scoretext = "Text2";
}

if (score > 500 ) {
    scoretext = "Text3";
}

if (score > 750 ) {
    scoretext = "Text4";
}

答案 1 :(得分:2)

变量score被写为字符串。你应该不加引号地写它:

<script>
    var scoretext;
    if (score < 45) {
        scoretext = "Text1";
    } else if (score > 100 ) {
        scoretext = "Text2";
    } else if (score > 500 ) {
        scoretext = "Text3";
    } else if (score > 750 ) {
        scoretext = "Text4";
    }
    document.getElementById("customegotext").innerHTML = scoretext;
</script>

答案 2 :(得分:2)

这:if ("score" < 45)正在将字符串与整数进行比较。

将其更改为if (score < 45),这将是一个(int)变量为整数。