\r\n \r\n \r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n
\r\n\r\n \r\n\r\n```\r\nテーブルは4行で、1~16の数値が入る想定で、処理を書いてみました。\r\nしかし、画面に表示されたのはボタン要素の部分のみでした。原因が分からない為教えて頂けましたら幸いです。","answerCount":1,"upvoteCount":0,"datePublished":"2019-08-08T10:43:59.059Z","dateModified":"2019-08-08T10:46:36.378Z","acceptedAnswer":{"@type":"Answer","text":"とりあえず\r\n\r\n
\r\n↓↓↓\r\n
\r\n\r\nそれと同じidが複数のタグに振られているのでその辺りロジックから見直したほうがよいでしょう","dateModified":"2019-08-08T10:52:44.452Z","datePublished":"2019-08-08T10:49:10.171Z","upvoteCount":0,"url":"https://teratail.com/questions/205089#reply-303096"},"suggestedAnswer":[],"breadcrumb":{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"トップ","url":"https://teratail.com"},{"@type":"ListItem","position":2,"name":"JavaScriptに関する質問","url":"https://teratail.com/tags/JavaScript"},{"@type":"ListItem","position":3,"name":"JavaScript","url":"https://teratail.com/tags/JavaScript"}]}}}
teratail
回答率
85.29%
質問するログイン新規登録
トップJavaScriptに関する質問
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

1回答

345閲覧

テーブルが表示できない

aae_11
aae_11

総合スコア178

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2019/08/08 10:43

編集2019/08/08 10:46

0

0

javascriptにて、テーブルデータを表示する処理を作ってみたのですが、テーブル部分が表示されません。

html
1<!DOCTYPE html>
2<html lang="ja">
3  <head>
4    <meta charset="utf-8">
5    <title>rulet</title>
6    <script src="http://code.jquery.com/jquery-3.3.1.min.js"></script>
7    <script>
8      const MAX_SIDE = 4;
9      $(function(){
10        var number = 1;
11        $('#contents').append('<table id="rulette_table></table>');
12        for(var i = 1; i <=MAX_SIDE; i++){
13          $('#rulette_table').append('<tr id="route_' + i + '"></tr>');
14          for(var j = 1; j <= MAX_SIDE; j++){
15            $('#route_' + j).append('<td id="num_' + j + '">' + number + '</td>');
16              number++;
17          }
18
19        }
20      });
21      
22    
23    </script>
24  </head>
25  <body>
26    <div id="wrap_contents">
27      <div id="contents"></div>
28      <div id="btns">
29        <button id="start">start</button>
30        <button id="stop">stop</button>
31        <button id="reset">reset</button>
32      </div>
33    </div>
34
35  </body>
36</html>

テーブルは4行で、1~16の数値が入る想定で、処理を書いてみました。
しかし、画面に表示されたのはボタン要素の部分のみでした。原因が分からない為教えて頂けましたら幸いです。

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

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1件

0

ベストアンサー

とりあえず

<table id="rulette_table></table> ↓↓↓ <table id="rulette_table"></table>

それと同じidが複数のタグに振られているのでその辺りロジックから見直したほうがよいでしょう

投稿2019/08/08 10:49

編集2019/08/08 10:52
yambejp
yambejp

総合スコア118164

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

aae_11
aae_11

2019/08/08 10:52 編集

ありがとうございます。 データを表示することができました。しかし数値がめちゃめちゃになってることが発覚しました...
yambejp
yambejp

2019/08/08 10:53

希望する最終形がわからないのでなんとも・・・ 図示するなり、動作を言葉で説明したほうがよいでしょう
aae_11
aae_11

2019/08/08 10:58

最終的には、１～１６の連番の数値をテーブル内に表示したいと考えていました。 今見直していたのですが、「$('#route_' + i)」ここの「i」が「ｊ」になっていたのでここの部分を修正しましたら、連番でテーブル内で表示することができました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

質問の解決につながる回答をしましょう。 サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。 また、読む側のことを考えた、分かりやすい文章を心がけましょう。

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

ただいまの回答率
85.29%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

トップJavaScriptに関する質問

テーブルが表示できない