открытие и скрытие нескольких элементов холста - PullRequest
0 голосов
/ 09 апреля 2020

У меня есть сайт с играми, и я могу успешно сначала скрыть холст и отобразить холст с помощью onclick="run()". Но теперь я хочу иметь страницу с несколькими играми. например, страница с названием «Игры-головоломки» с несколькими играми и несколькими игровыми кнопками.

В моем файле php у меня есть:

<div id="Game">
    <?php echo '


    <h1>Word Dials</h2>
    <form id = "score" action="'.setScore($conn).'" method="POST">
        <input type="text" value="'.$brickz.'" name="score" id="update" readonly>
        <button type="submit" class="button" name="save">Update Score</button>
    </form>

    <p id="test">Click to play Dials Word edition. Press "Q" to quit the game and dont forget to upload your score if you beat your high score. 
            Backing out of the application may cause you to lose your game progress. If you like the game or want to see something in future games, comment below. 
            Enjoy!</p>
    <button class="button" onclick="words()">play</button>';

    echo "<br>";


        ?>
</div>

<div id="Game2">
    <?php echo '


    <h1>Brickz</h2>
    <form id = "score" action="'.setScore($conn).'" method="POST">
       <input type="text" value="'.$brickz.'" name="score" id="update" readonly>
       <button type="submit" class="button" name="save">Update Score</button>
    </form>

    <p id="test">Click to play brickz. Press "Q" to quit the game and dont forget to upload your score if you beat your high score. 
            Backing out of the application may cause you to lose your game progress. If you like the game or want to see something in future games, comment below. 
            Enjoy!</p>
   <button class="button" onclick="run()">play</button>';

   echo "<br>";


   ?>
</div>

<canvas id="play"></canvas>
<canvas id="words"></canvas>


<script src="brickz.js"></script>
<script src="words.js"></script>

и в кирпиче. js:

var playing = false

function run() {

    document.getElementById("brickz").style.display = "block";
    document.getElementById("Game").style.display = "none";
    document.getElementById("Game2").style.display = "none";
    document.getElementById("words").style.display = "none";

    playing = true;

}

if (playing) {

   ...rest of game code

один и тот же код используется для слов. js кроме как с помощью функции words () вместо run и, конечно, document.getElementById("words").style.display = "block"; захват другого холста. На моем сайте этот способ скрытия холста и отображения работает с одной игрой, но если я пытаюсь добавить в игру вторую игру, то ни одна из игр, похоже, не работает. У кого-нибудь есть предложения, как скрыть и отобразить холст, чтобы я мог иметь несколько игр на одной странице. Спасибо!

...