チェックボックスについて質問！！ プログラミング初心者です。 チェックボックスで チェックされたもの

チェックボックスについて質問！！

プログラミング初心者です。

チェックボックスで

チェックされたものだけを表示するには

どのようなプログラミングをすればよろしいのですか。


※複数選択してもらい、チェックされたものだけを表示したいです。

質問者からの補足コメント

• 〇JavaScriptで考えています。
  
  〇表示したいものは、チェックされた項目です。
  
  ex．︎︎︎︎
  
  好きな物
  ☑︎魚
  □肉派
  ☑︎野菜
  ▶全ての✔終了
  ▶「 魚、野菜 」
  のように、✔した所だけ表示させたいです。
  
  
  
  〇まだ始めておりません。

    補足日時：2021/07/20 10:27

• ちなみに、
  
  
  ☆ 〇 ×
  ☑︎ □ □ 魚
  □ □︎︎︎︎ ☑︎ 肉派
  ☑︎ □ □ 野菜
  ▶全ての✔終了
  ▶「 魚、野菜 」
  のように、✔した所だけ表示
  
  のように、選択肢を増やすことは出来ますか？

    補足日時：2021/07/22 04:13

• 恐縮ながら更に質問させて下さい。
  
  チェックボックスの表示のやり方は、
  お陰様で理解することができました！
  
  が、☆の項目に✔したものだけを表示させる方法が調べてみましたが分かりませんでした。
  
  ご教授お願いします！

    補足日時：2021/07/25 13:45

No.1 回答者： くんこば 回答日時： 2021/07/20 10:18

エクセルVBA？

JavaScript？

表示って何を？
書きかけのコードはある？

No.2 回答者： lv4u 回答日時： 2021/07/20 10:20

忘れましたが、チェックボックスの処理は、ちょっと面倒な部分があったと思います。

ネットを探せば、サンプルがあると思います。

No.3 回答者： Ogre7077 回答日時： 2021/07/20 19:41

HTML のページでのお話ならば、以下のようになるかと思います。

<form>
<label><input name=thing type=checkbox>モノ</label>
...
</form>

というフォームに登録した "change" イベント処理にて、
例) フォーム要素.addEventListener('change', イベント処理, false)

フォーム内のチェック済み入力要素をすべて抜き出し、
例) フォーム要素.querySelectorAll('input[name=thing]:checked')

それぞれの要素を対応する名前に変換して句読点区切りで結合し、
例) 要素一覧.map(要素から名前に変換する処理).join("、")

特定の要素内にテキストとして表示する
例) 特定の要素.textContent = テキスト

この回答へのお礼

ご丁寧にありがとうございます！

お礼日時：2021/07/22 04:07

No.4 回答者： Ogre7077 回答日時： 2021/07/22 09:05

補足 No.2 について

選択肢毎に name 属性を分ければ良いかと
<input name=like value=29 type=checkbox>
<input name=ok value=29 type=checkbox>
<input name=ng value=29 type=checkbox> にく

余談ではありますが、

チェックボックス単体はとても小さいので、
タッチ操作時の誤操作防止や操作性向上を目的に、
チェックできる反応範囲を広げる様な画面設計をお勧めします。
例) <input type=checkbox>好き ← 反応範囲が狭い
例) <label><input type=checkbox>好き</label> ← 広がる

この回答へのお礼

ありがとうございます！！
やってみます！！

お礼日時：2021/07/23 05:27