質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.10%

PHP ビンゴゲームでボタンを押した際に、数字がランダムに灰色になる処理を記述したい

解決済

回答 2

投稿 編集

  • 評価
  • クリップ 1
  • VIEW 367

score 23

PHPでビンゴゲームを作っています。PHPはドットインストールで無料の入門編を終えたばかりのレベルです
スタートボタンを押すと、ランダムに数字に色がついていくといった処理を描きたいのですが、処理の書き方が全く思いつきません。考えていてもらちが明かないので、ほかの人が作ったビンゴゲームのバックエンド部分を参考にしてみたのですが、それでも処理の方法がわかりません。どのように処理を記述していけばよいでしょうか?

 

該当のソースコード

<DOCTYPE heml>
  <html lang ="ja">
<head>
 <meta chaset="utf-8">
 <title>ビンゴゲーム!</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
  <div id="container">
  <table>
    <tr>
      <th>B</th><th>I</th><th>N</th><th>G</th>
      <th>O</th>
    </tr>
    <tr>
     <td>1</td>
     <td>2</td>
     <td>48</td>
     <td>5</td>
     <td>69</td>
   </tr>
   <tr>
    <td>5</td>
    <td>6</td>
    <td>7</td>
    <td>8</td>
    <td>9</td>
   </tr>
   <tr>
    <td>7</td>
    <td>22</td>
    <td>SPACE</td>
    <td>49</td>
    <td>62</td>
   </tr>
   <tr>
    <td>13</td>
    <td>28</td>
    <td>33</td>
    <td>46</td>
    <td>63</td>
   </tr>
   <tr>
    <td>3</td>
    <td>27</td>
    <td>32</td>
    <td>44</td>
    <td>73</td>
   </tr>
</table>
<input type="submit" name="add" value="スタート" />
</body>
body {
  font-family: Arial, sans-serif;
  text-align: center;
  font-size: 16px;
}
#btn{
  width: 200px;
  height: 100px;
  background: crimson;
  border-radius: 50%;
  margin: 30px auto;
  text-align: center;
  line-height: 100px;
  font-weight: bold;
}

#container {           
  margin: 0 auto;
  width: 322px;
}

td,th {
  width: 60px;
  height: 45px;
}

td {
  background-color: burlywood;
  text-align: center;
  border-radius: 50%;
}
th {
  color: rgb(9, 255, 0);
}

イメージ説明

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • rikutennis

    2020/04/30 17:49

    バックエンドの処理はjsに書かれていますか??
    もしそうであればjsの基本から勉強したらいいのでは、と思います。

    キャンセル

  • HdNu

    2020/04/30 18:10

    Js部分は、何も記載しておりません。失礼いたしました

    キャンセル

  • yukke_

    2020/05/02 09:22

    PHPで、っておっしゃってますけど、PHPでならなければいけない理由はありますか?
    なければ、JSでやってしまったほうが簡単だと思うのですが。

    キャンセル

  • hoshi-takanori

    2020/05/02 13:24

    ビンゴの処理がわからないのか、PHP でサーバーとやりとりする部分がわからないのか、たぶん両方でしょうね…。

    キャンセル

回答 2

checkベストアンサー

+1

PHPはドットインストールで無料の入門編を終えたばかりのレベルです

がどれくらいのレベルなのか私は分からないのですが(やったことないから)

それでも処理の方法がわかりません。これはただ単に勉強不足というだけなのでしょうか? 

まず前提として「作りたいものそのままを作ってる人はどこにもいない」という考えを原点とすることです。
となると自分で考えなければいけません。これは勉強不足と言うより経験不足と言えるのではないでしょうか。

例えば、ある対人スポーツで、どんなに基礎を身に付けたとしても、実戦で咄嗟に適切な判断ができるかというと、経験が必要ですし、普段の練習から実戦を意識した練習をしているかどうか、積み重ねられているかが重要です。

それと考え方は同じです(例えって本当はあまり良くないのですけど)

書いた通りにしか動かないプログラミングにおいて、「思った通りに動かせるようになる」となると相当経験を積まなければなりません。私は一応PHPが一番長くやっていますが、未だに想定の結果を一発で得られないこともありますし、一発で得られたら喜びすらあります。そういうものです。

となると、
結局自分でしっかりと考えるしかない。
「手法」に囚われるのではなく、「何」を「なぜ」作るのか。という要件定義の部分をどれだけしっかり考えるかになってきます。
なぜなら、「あるもの」は唯一ですが、「あるものを実現させるための手段」は無数にあるからです。
簡単な例で、「"Hello"と出力しましょう」と言う課題があったとして、結構やり方は沢山でてくると思います。どんな過程を経たとして「Hello」って出ればいいわけですから。

ということで、
「どうすればいいか分からない」ような質問があったときに「そこは答えがどこかに転がってるわけではなく、考えるもの」というアドバイスになることが多いです。
またはコードそのものではなく、「考え方の1つ」に焦点を当てたアドバイスですね。
「考え方の1つ」なので、それも絶対唯一ではないので注意です。
もっと簡単な考え方もあるかもしれないし、もっと難しいやり方もあるかもしれない。
どれが適切かというのは判断は難しい。「どこまでの範囲を考えるか」にもよるから。

まずは要件をきちんと整理していきましょう。
あと、73と言う大きな数字を扱ってるように見えますが、もっと少なくてもいいんじゃないですか?5くらいからで良いと思いますよ。

それよりも、もっと細かく細分化していくところからです。
それこそ「個別の処理が思いつくくらいに細分化する」こと。

下記の質問についた回答が参考になるのではないでしょうか。
teratail:プログラミングを使って作りたいものがある時の調べ方、プログラムの組み立て方

それに、PHPの配列操作の関数って沢山あるので、細分化したうえで色々試してみると良いかもしれません。


追記。
マニュアル確認して・・・だと、そもそもHTMLから怪しい部分が結構あるので、
そこは確実にされたほうが良いかと思います。

<DOCTYPE heml>

とか

<meta chaset="utf-8">

先に書いた通り、プログラムは書いた通りにしか動かないので、
正しく書かれてないと正しく動く保証はありません。それがHTMLであっても。
※ブラウザがうまいこと拾ってくれて動くように見えてるところもあるでしょうが、そこに甘えてはいけないと私は思います。

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

0

スタートボタンを押すと、ランダムに数字に色がついていくといった処理を描きたいのですが、処理の書き方が全く思いつきません。考えていてもらちが明かないので、ほかの人が作ったビンゴゲームのバックエンド部分を参考にしてみたのですが、それでも処理の方法がわかりません。これはただ単に勉強不足というだけなのでしょうか?

要は、指定範囲内の重複しない乱数を生成して、それを出力すれば良いだけ。
なので、調べ方としては「PHP 乱数 重複しない」あたり。

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2020/05/01 11:45 編集

    rand for文などを使って乱数を生成する方法はわかりました。しかしスタートボタンを押した際に色が変わるという処理にどう結び付けていいのかわからりません。自分の中では、~をしたときに、乱数が動く仕組みを処理にしていく、
    switch文と乱数処理を組み合わせると考えているのですが方向性はあってますでしょうか?

    キャンセル

  • 2020/05/01 15:02

    いろいろやり方はあると思いますが、スタートボタンを押すまでは、他のclass等で色を共通のにして置き、それをjQueryで外してPHPで出力した色にすればよいのではないでしょうか?
    もしも、自分が言っている意味がよくわからない場合は行ってください。
    もしかしたら、質問者さんがイメージされている完成図と自分がイメージしている完成図が違うかもしれません。

    キャンセル

  • 2020/05/01 19:20 編集

    いろいろ模索した結果、body要素内にこのような処理が作れたのですが、変化はありませんでした。

    <?php

    if(isset ($_POST['add'])){
    echo $rand = mt_rand( 1, 73 );
    }

    ?>
    恐らく処理の組み合わせ方がいまいちわかっていないのですがいかがでしょうか?私としてはadd(スタート)を押すと、設定した乱数mt_randがランダムに変わるというイメージで記述したのですが

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 88.10%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る

  • トップ
  • PHPに関する質問
  • PHP ビンゴゲームでボタンを押した際に、数字がランダムに灰色になる処理を記述したい