Question

我做记忆并在转牌时遇到问题。在转动两张牌之后，当我转动第三张牌时，我想要再次转动之前的2张牌，但由于某种原因，有时它会起作用，有时只有两张牌中的第一张转牌。知道为什么会这样吗？

JAVASCRIPT（我觉得那里有问题）：

var cartas = [];
var cartasGiradas = [];
var parejas= 0;
function cambiar_clase(){
   cartasGiradas = document.getElementsByClassName("flip-container clicked");
   if(cartasGiradas.length==2){
      for (var i = 0; i <= cartasGiradas.length; i++) {
         cartasGiradas[i].className="flip-container";
         this.classList.add("clicked");}
      }else if(cartasGiradas.length < 2){
         this.classList.add("clicked");
      }
   }
function inicializar(){
   cartas = document.getElementsByClassName("flip-container");
   for(var i = 0; i < cartas.length; i++){
      document.getElementById("a_girar"+i).addEventListener( 'click', cambiar_clase());
   }
}

HTML源代码：

<html>
  <head>
    <script type="text/javascript" src="javascript_memory.js"></script>
    <link rel="stylesheet" type="text/css" href="css_memory.css">
    <title>MEMORY GUERRA</title>
    <meta charset="utf-8">
  </head>
  <body onload="inicializar()">
    <table>
      <tr>
        <td class='color_fondo'>
          <div class='flip-container' id='a_girar0'>
            <div class='flipper'>
              <div class='front'>
                <img src='tras_carta.jpg' class='fotos'>
              </div>
              <div class='back'>
                <img src='cartas/animal_15.jpg' class='fotos'>
              </div>
            </div>
          </div>
        </td>
        <td class='color_fondo'>
          <div class='flip-container' id='a_girar1'>
            <div class='flipper'>
              <div class='front'>
                <img src='tras_carta.jpg' class='fotos'>
              </div>
              <div class='back'>
                <img src='cartas/animal_14.jpg' class='fotos'>
              </div>
            </div>
          </div>
        </td>
      </tr>
    </table>
  </body>
</html>

希望有人可以提供帮助，如果我的英语不好，请对不起，再见！

转牌（记忆）

0 个答案: