プログラム言語:javascript_jquery:フォームの値_input_selectなど_の操作

差分

このページの2つのバージョン間の差分を表示します。

この比較画面にリンクする

--- プログラム言語:javascript_jquery:フォームの値_input_selectなど_の操作 [2019/05/21 12:42]
yusuke_komori
+++ プログラム言語:javascript_jquery:フォームの値_input_selectなど_の操作 [2020/08/18 11:34]
humolife [input（チェックボックス、ラジオボタン）の操作]
@@ 行 94: / 行 94: @@
   });
 });
+</script>
+</body>
+</html>
+</code>
+===== input（チェックボックス）の操作 =====
+<code>
+<html>
+<meta>
+<meta charset="UTF-8">
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
+</meta>
+<body>
+<label><input type="checkbox" name="status[]" value="1">あ</label>
+<label><input type="checkbox" name="status[]" value="2">い</label>
+<label><input type="checkbox" name="status[]" value="3">う</label>
+<label><input type="checkbox" name="status[]" value="4">え</label>
+<button type="button" class="btn-status">ステータス</button>
+<script>
+$(function() {
+  $('.btn-status').on('click', function(){
+    let status = $('input[name="status[]"]:checked').map(function() {
+      return $(this).val()
+    }).get()
+    console.log(status)
+  })
+})
 </script>
 </body>

プログラム言語/javascript_jquery/フォームの値_input_selectなど_の操作.txt · 最終更新: 2021/04/15 16:34 by humolife