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

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

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

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

Q&A

解決済

2回答

878閲覧

JavaScript基礎 特定のname属性でフィルターリングする

root2

総合スコア14

JavaScript

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

0グッド

0クリップ

投稿2018/11/07 05:28

前提・実現したいこと

初心者です。検索しても分からなかったので教えてください。
チェックボックスを一括ですべてチェックを入れたり、チェックを外したりする装丁があります。
更新にあたり、項目が増え、項目ごとに一括操作したいのですが、すべてに反映してしまいます。
項目ごとに<input>にname属性で指定おりますので、その属性を条件に加えたいです。

よろしくお願いたします。

発生している問題・エラーメッセージ

.filter('xxxx')
name属性を指定する場合の「xxxx」の記述方法が分かりません。
また、.filterで合っているのかも分かりません。

該当のソースコード

HTML

1<ul> 2 <li> 3 <input type="checkbox" name="null" value="1">1このチェックボックスには反映させたくない</li> 4 <li> 5 <input type="checkbox" name="null" value="2">2このチェックボックスには反映させたくない</li> 6 <li> 7 <input type="checkbox" name="null" value="3">3このチェックボックスには反映させたくない</li> 8 <li> 9 <input type="checkbox" name="null" value="4">4このチェックボックスには反映させたくない</li> 10</ul> 11<div class="dateSearchBtn"> 12 <p class="level-checked"><span>全て選択する</span> </p> 13 <p class="level-checked-clear"><span>全て解除する</span> </p> 14 <!-- /.dateSearchBtn --> 15</div> 16<div class="dateSearchCheck"> 17<ul> 18 <li> 19 <input type="checkbox" name="level" value="a">A全選択・解除を反映させたい</li> 20 <li> 21 <input type="checkbox" name="level" value="b">B全選択・解除を反映させたい</li> 22 <li> 23 <input type="checkbox" name="level" value="c">C全選択・解除を反映させたい</li> 24 <li> 25 <input type="checkbox" name="level" value="d">D全選択・解除を反映させたい</li> 26</ul> 27

JavaScript

1;(function($,window,c){ 2 $(function(){ 3 if( !$( c.checked.className ).length ) return; 4 $( c.checked.className ).on('click',function(){ 5 $('body').find('form').find('input').filter(':checkbox').each(function(){ 6 $(this).prop('checked', true); 7 }); 8 }); 9 $( c.clear.className ).on('click',function(){ 10 $('body').find('form').find('input').filter(':checkbox').each(function(){ 11 $(this).prop('checked', false); 12 }); 13 }); 14 }); 15})(jQuery,window,{ 16 checked : { 17 className : '.level-checked' 18 }, 19 'clear' : { 20 className : '.level-checked-clear' 21 } 22});

試したこと

$('body').find('form').find('input').filter(':checkbox').each(function(){
この文を下のパターンで試しましたがダメでした。
$('body').find('form').find('input').filter(':checkbox').filter(':level').each(function(){
$('body').find('form').find('input').filter(':checkbox').filter('level').each(function(){
$('body').find('form').find('input').find('level').filter(':checkbox').each(function(){

補足情報(FW/ツールのバージョンなど)

ここにより詳細な情報を記載してください。

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

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

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

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

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

m.ts10806

2018/11/07 05:51

「初心者アイコン」がありますのでそちらを利用いただけたらと。また、提示の内容だけでは何をどう調べて試したかわかりませんので、検索ワード、参考にした記事URLなどを提示してください。検索して「何がわからなかったのか」も具体的に記載してください
root2

2018/11/07 05:58 編集

初心者アイコンを知りませんでした。ご教授ありがとうございます。投稿後に付ける方法がわかりませんので、次回から気を付けます。
guest

回答2

0

$('body').find('form').find('input').filter(':checkbox').each(function(){

$(this).prop('checked', false);
});

なにもbodyから引っ張ることないでしょう。またeachもいらないと思います
inputもform以外にないならイラないです

javascript

1$('[name=level]').prop('checked', false)

的なもので十分では?

投稿2018/11/07 07:37

yambejp

総合スコア114574

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

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

0

自己解決

質問の提示が適切でなくて申し訳ございませんでした。

.filter('xxxx')
name属性を指定する場合の「xxxx」の記述方法が分かりません。

と質問させていただきましたが、

.filter('input[name="level"]')
という答えにたどりつきました。

ありがとうございました。

投稿2018/11/07 06:13

root2

総合スコア14

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問