Q&A
質問文のコードはそれぞれコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。
現在、オセロゲームをJ Queryで作成しております。
初心者で全くわからない状況からの作成でいろいろと質問して解決しながら作成していきたいと思います。
質問１、
現在、オセロのマス８x８をなんとか表示できたのですが、１から６４まで手書きしております。
これを JQueryで短くかけないかと時間を費やしているのですが進まない状況です。
アドバイスお願いします。
以下が、コードです
JQuery
1<script> 2 $(document).ready(function(){ 3 var html='', 4 for(var i=0; i<64; i++){ //ここがエラー 5 html += 6 <div class="flex"> 7 <p class="bord"></p> 8 } 9 }); 10 }); 11 </script>
html
1 <body> 2 <h1 class="title">オセロ</h1> 3 <div class="wrapper"> 4 <div class="flex"> 5 6 <p class="bord">1</p> 7 <p class="bord">2</p> 8 <p class="bord">3</p>・・・・・<p class="bord">64</p> 9
CSS
1@charset "utf-8"; 2*{ 3 margin: 0; 4} 5.title{ 6 text-align: center; 7 margin-bottom: 30px; 8} 9.wrapper{ 10 display: flex; 11 justify-content: center; 12} 13.flex{ 14 display: flex; 15 flex-direction: row; 16 justify-content: center; 17 flex-wrap: wrap; 18 width: 700px; 19 text-align: center; 20/* align-content: center;*/ 21} 22.bord{ 23 width:80px; height:80px; background:darkgreen; 24 border: 2px solid black; 25}
回答1件
0
ベストアンサー
コードを貼り付ける時は </> のアイコンをクリックしてその中に書いてください。
そうしないと消えてしまう文字もあります。
パッと見で「var html='',」←ここカンマじゃなくてセミコロンでは？と思いましたが。
◆追記 2018.03.18 15:01
これでどうですか？
javascript
1<script> 2$(document).ready(function(){ 3 var html=''; 4 for(var i=0; i<64; i++){ 5 html += '<p class="bord">' + String(i) + '</p>'; 6 if (i % 8 == 0) { 7 html += "<br/>"; 8 } 9 } 10 $(".flex").html(html); 11}); 12</script>
投稿2018/03/18 05:40
編集2018/03/18 06:02
総合スコア287
ご指摘の点
パッと見で「var html='',」←ここカンマじゃなくてセミコロンでは？と思いましたが。
変更して見ましたが、うまくいきませんでした。
ありがとうございます。うまく表示されました。記述内容での質問なのですが。
１、
$(".flex").html(html); この記述はどのような意味があるのでしょうか？
２、htmlの方の記述は、以下のように変更してみましたがよろしいでしょうか？
<div class="flex">
<p class="bord"></p>
</div>
1. flexクラスの要素に作ったhtmlを入れるという意味です。
2. <div class="flex"></div>だけで十分です。
あなたの回答
tips
プレビュー
