どうすればJavaScriptのCSSアクションをトリガーできますか？

Question

私は、javascript、php、およびcssを使用して、メモリゲームコードを持っています。

ゲームがPHPで終了したときに何らかのイベントを登録して、結果をデータベースに保存できるようにしたいと考えています。

つまり、<div id="player_won"></div>の内部にPHPコードを挿入して、勝利イベントを適切にトリガーしたいと思います。

1. CSS

   #player_won{ 
   display: none; 
   } 
   

2. javascriptの

   $(document).ready(function(){ 
   $(document).bind("game_won", gameWon); 
   } 
   
   function gameWon(){ 
   $.getJSON(document.location.href, {won: 1}, notifiedServerWin); 
   var $game_board = $("#game_board"); 
   var $player_won = $("#player_won"); 
   $game_board.hide(); 
   $player_won.show(); 
   $game_board = $player_won = null; 
   }; 
   

Answer 1

あなたはページからいくつかの情報を送信し、伝えるAJAX呼び出しを作成したいと思いますプレーヤーが勝った場合は以下のphpファイル失われたその後、foo.phpの内部でプレーヤに必要なロジックを処理し、AJAX呼び出しの内部でsuccess関数にJsonを返して、それに応じてページを更新することができます。

インデックス

$(document).ready(function() { 
    //look for some kind of click below 
      $(document).on('click', '#SomeId', function() { 

     //Get the information you wish to send here 
     var foo = "test"; 
       $.ajax({ 
        url: "/foo.php", 
        type: 'POST', 
        cache: false, 
        data: {Info: foo}, 
        dataType: 'json', 
        success: function (output, text, error) 
        { 

        //here is where you'll receive the son if successfully sent 
        if(ouput.answer === "yes"){ 
         $("#player_won").show(); 
        } else { 
         // Do something else 
        } 

        }, 
        error: function (jqXHR, textStatus, errorThrown) 
        { 
         //Error handling for potential issues. 
         alert(textStatus + errorThrown + jqXHR); 
        } 
       }) 
      }) 
     }); 

foo.php

<?php 

    if(isset($_POST['Info'])){ 
     //figure out if what was sent is correct here. 

     if($_POST['Info'] === "test"){ 
     $data['answer'] = "yes"; 

     echo json_encode($data); 

     exit; 
     } else { 
     // do something else 

     } 
    } 
?>