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

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

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

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

Q&A

解決済

1回答

350閲覧

display none inlineについて

debauchery

総合スコア10

JavaScript

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

0グッド

0クリップ

投稿2019/06/19 07:07

javascript にてチェックボックス(5個中任意の個数)を選択し,ボタンをクリックした際にstyle.display = "inline"にしたところ

table内に表示はされるのですが,1つのセルにチェックボックスで選択した分の要素が表示されてしまいます。

どのようにすると一つ一つが独立したセルに表示されるのでしょうか?
ご教授お願いいたします。

環境はIE11です。

javascript

1let btn = document.getElementById("btn"); 2 btn.addEventListener("click", function() { 3 let checkEigyo = document.getElementById("checkEigyo"); 4 let checkNUmber = document.getElementById("checkNumber"); 5 let checkMeka = document.getElementById("checkMeka"); 6 let checkKatashiki = document.getElementById("checkKatashiki"); 7 let checkEng = document.getElementById("checkEng"); 8if(document.forms.checkform.checkEigyo.checked) {//checkboxのチェック有無 9 sub2.style.display = "inline-block"; 10 // alert("eigyo"); 11 }else { 12 sub2.style.display = "none"; 13 } 14 if(document.forms.checkform.checkNumber.checked) { 15 sub3.style.display = "inline-block"; 16 // alert("eigyo"); 17 }else { 18 sub3.style.display ="none"; 19 } 20 if(document.forms.checkform.checkMeka.checked) { 21 sub4.style.display = "inline"; 22 // alert("eigyo"); 23 }else { 24 sub4.style.display = "none"; 25 } 26 if(document.forms.checkform.checkKatashiki.checked) { 27 sub5.style.display = "inline"; 28 // alert("eigyo"); 29 }else { 30 sub5.style.display ="none"; 31 } 32 if(document.forms.checkform.checkEng.checked) { 33 sub6.style.display = "inline"; 34 // alert("eigyo"); 35 }else { 36 sub6.style.display = "none"; 37 } 38 }); 39 40

html

1<td><input type="checkbox" name="checkElements" value="checkEigyo" id="checkEigyo"></td> 2 <td><input type="checkbox" name="checkElements" value="checkNumber" id="checkNumber"></td> 3 <td><input type="checkbox" name="checkElements" value="checkMeka" id="checkMeka"></td> 4 <td><input type="checkbox" name="checkElements" value="checkKatashiki" id="checkKatashiki"></td> 5 <td><input type="checkbox" name="checkElements" value="checkEng" id="checkEng"></td> 6省略 7 <tr id="csvcondition"> 8 <th id="sub1">社号</th> 9 <th id="sub2"></th> 10 <th id="sub3">登録No</th> 11 <th id="sub4">メーカー</th> 12 <th id="sub5">型式</th> 13 <th id="sub6">ENG</th> 14 </tr>

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

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

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

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

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

guest

回答1

0

ベストアンサー

sub2~sub6の変数が宣言されていないです
これはthのsytleでdisplayをinlineに変えるという趣旨でしょうか?
それはテーブルのセル表示をやめるということなのでやめたほうがいいでしょう
具体的には何をどうしたいか書いたほうが想定の表示を回答しやすいです

投稿2019/06/19 08:30

yambejp

総合スコア114572

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問