• 締切済み

チェックが入っていなかったら処理を行いたい

いつもお世話になっております。 只今チェックボックスにチェックが入っていなかったらチェックを入れるという処理を Javascript、JQueryで行いたいのですが上手く動作せずに困っております。 if ( $( 'input:checkbox[name="tax_input[pick-up][]"]' ).is( 'checked' ) == false ) { jQuery('input:checkbox[name="tax_input[pick-up][]"]').removeAttr ( 'checked' ); jQuery('input:checkbox[name="tax_input[pick-up][]"]:eq(3)').attr ( 'checked', 'checked' ); } 上記のソースで試したのですが反応が全くありませんでした。 if( $( 'input:checkbox[value="98"]' ).is( ':checked' ) ) { jQuery('input:checkbox[name="tax_input[pick-up][]"]').removeAttr ( 'checked' ); jQuery('input:checkbox[name="tax_input[pick-up][]"]:eq(2)').attr ( 'checked', 'checked' ); } チェックが入っている場合の判定ですが上記の場合は動きました。 記述ミス、根本的に書き方が違うなどございましたらご指摘ください。 ご回答のほどどうぞよろしくお願い致します。

みんなの回答

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.5

横からですが、ご提示の部分がうまく動かない本当の原因でしょうか？ 念のため alert("直前までＯＫ"); 　if ( $( 'input:checkbox[name="tax_input[pick-up][]"]' ).is( 'checked' ) == false ) { alert("条件分岐処理中"); 　　jQuery('input:checkbox[name="tax_input[pick-up][]"]').removeAttr ( 'checked' ); 　　jQuery('input:checkbox[name="tax_input[pick-up][]"]:eq(3)').attr ( 'checked', 'checked' ); 　} alert("条件処理終了"); のようなことをすれば、どの行が思う通りでないのか特定でき、原因の絞込みができるかと思います。 ひょっとすると、最初のalert()が出ないのではないかと、想像しますが…

  • LancerVII
  • ベストアンサー率51% (1060/2054)
回答No.4

こんにちは。 一応、実際にJavaScriptを組んでみてis(':checked')にて返ってくる値がどうなってるか試したので、判定方法は問題ないと思います。 jQueryのセレクタの場合HTMLの構成がちょっと変わるだけで違った結果になる可能性もあります。 うまく動かないというのが意図しない動きなのかエラーなのかわかりませんが、 載せられるならHTMLを含めて補足ください。 そして、どういった時にどういうふうにしたいかを明確にして頂ければもうちょっと的確に回答できると思います。

  • LancerVII
  • ベストアンサー率51% (1060/2054)
回答No.3

こんにちは。 度々すいません。 試してみましたがやはり、複数取得できている可能性があるとその要素内に一つでもチェックがあるとis(':checked')はtrueを返します。 <input type="checkbox" name="tax_input[pick-up][]"> <input type="checkbox" name="tax_input[pick-up][]"> <input type="checkbox" name="tax_input[pick-up][]"> こうあったとして、どれか一つでもcheckが入っていたら $( 'input:checkbox[name="tax_input[pick-up][]"]' ).is( 'checked' ) はtrueを返します。 なので意図した動きになっていない可能性があります。

sharpdane
質問者

補足

非常に親切に対応していただいてありがとうございます。 ご指摘いただいた点を修正し一つのチェックボックスを対象に 判定をかけてみたのですがやはり動きませんでした。 その他のIf文も試してみたのですがIfに限りやはり上手く動かないようです・・・

  • LancerVII
  • ベストアンサー率51% (1060/2054)
回答No.2

こんにちは。 HTMLがどのようになっているかわからないのでピンポイントでの回答が難しいのですが、 $( 'input:checkbox[name="tax_input[pick-up][]"]' )で取得している要素が意図しているものであるか確認してみてください。 (上記だと複数の要素を取得している気がします) 動いたと言われる下の取得ですとvalue=98のcheckboxと特定できています。 (value=98が2個あったらまた同じような話かもしれません) if( $( 'input:checkbox[value="98"]' ).is( ':checked' ) ) {

  • LancerVII
  • ベストアンサー率51% (1060/2054)
回答No.1

こんにちは。 if ( $( 'input:checkbox[name="tax_input[pick-up][]"]' ).is( 'checked' ) == false ) { の部分が if ( $( 'input:checkbox[name="tax_input[pick-up][]"]' ).is( ':checked' ) == false ) { では？

sharpdane
質問者

補足

ご指摘ありがとうございます。 自分でいじってるうちに外してしまったままでしたm(_ _)m if ( $( 'input:checkbox[name="tax_input[pick-up][]"]' ).is( ':checked' ) == false ) { こちらに修正してもやはり動きません。 他のJSの処理は動いているので これは何か他の処理が邪魔しているということなのでしょうか？

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • 複数のチェックボックスをチェックしたい

    質問させてください。 複数のチェックボックスを項目別に全てチェックするようなjqueryの書き方をご教授いただきたいです。 <table> <tr> <td> <input type="checkbox" name="" />まとめてチェック </td> </tr> <tr> <td> <li><input type="checkbox" name="" value="" />a</li> <li><input type="checkbox" name="" value="" />b</li> <li><input type="checkbox" name="" value="" />c</li> <li><input type="checkbox" name="" value="" />d</li> </td> </tr> <tr> <td> <input type="checkbox" name="" />まとめてチェック </td> </tr> <tr> <td> <li><input type="checkbox" name="" value="" />e</li> <li><input type="checkbox" name="" value="" />f</li> <li><input type="checkbox" name="" value="" />g</li> <li><input type="checkbox" name="" value="" />h</li> </td> </tr> <tr> <td> <input type="checkbox" name="" />まとめてチェック </td> </tr> <tr> <td> <li><input type="checkbox" name="" value="" />i</li> <li><input type="checkbox" name="" value="" />j</li> <li><input type="checkbox" name="" value="" />k</li> <li><input type="checkbox" name="" value="" />l</li> </td> </tr> </table> 上記のようにそれぞれの項目に「まとめてチェック」のチェックボックスがあり、 そこに該当するチェック項目は全てチェックorチェックを外す っという挙動の実装を考えています。 jqueryでやりたいのですが、javascript、jqueryがかなり苦手でいまいちいきません。 ググって $(function(){ $('#all').click(function(){ if(this.checked){ $('#check input').attr('checked','checked'); }else{ $('#check input').removeAttr('checked'); } }); }); このソースを見つけたのですが、これだと一つの項目でしか実装できず 項目分このjqueryを書くのも余り良い書き方だと思えません。 どなたか、ご教授お願いいたします。

  • AJAXで生成したHTMLでのチェックボックス一括チェックの方法を教えてください

    現在jqueryを使って、ajaxでチェックボックスを生成して、それに対して一括チェックボタンを付けたいと考えております。 <input name="allcheck" type="checkbox" id="checkall" checked="checked" />全て<br /> <input type="checkbox" name="carrier" value="docomo" checked="checked" />docomo<br /> <input type="checkbox" name="carrier" value="au" checked="checked" />au<br /> <input type="checkbox" name="carrier" value="softbank" checked="checked" />softbank<br /> というチェックボックスがajaxで生成されて function carrier_check() { $('#checkall').click(function(e){ $(':checkbox[type=checkbox][name=carrier]').attr('checked', $('#checkall').attr('checked')); }); } のjavascriptで上記のチェックボックスを一括チェックできるようにしようとしているのですが ajaxを使わずに上記のチェックボックスをHTMLに書いているときは一括チェックできるのですが、ajaxを使用して生成した場合にはチェックボックスの一括チェックができません。 どのようにすれば、ajaxで生成されたチェックボックスを一括チェックできるようになるのでしょうか？ ご存知の方がいらっしゃいましたらご教授お願いいたします。

  • jQueryで複数のラジオボタンを処理

    jQueryを最近使い始めました。 以下のようなことをしたいのですが、いいやり方が分かりません。 jQueryを使ってページの読み込み後すぐに、ラジオボタンにチェックを入れたいと思っています。 以下のようにすると実際にチェックが入りました。 HTML <input type="radio" name="a" value="1" /> <input type="radio" name="a" value="2" /> jQuery if(!$("input:radio[name=a]:checked").val()){ 　$("input:radio[name=a]:first").attr("checked" , "checked"); } ラジオボタンが複数ある場合、上記のjQueryのnameの値を変えたものを増やしていけば対応できたのですが、ラジオボタンがたくさんある場合、同じようなスクリプトが何行も増えてしまいます。 うまく関数にする方法やその他よい対処法はないでしょうか。 <input type="radio" name="a" value="1" /> <input type="radio" name="a" value="2" /> <input type="radio" name="b" value="1" /> <input type="radio" name="b" value="2" /> <input type="radio" name="c" value="1" /> <input type="radio" name="c" value="2" /> … if(!$("input:radio[name=a]:checked").val()){ 　$("input:radio[name=a]:first").attr("checked" , "checked"); } if(!$("input:radio[name=b]:checked").val()){ 　$("input:radio[name=b]:first").attr("checked" , "checked"); } if(!$("input:radio[name=c]:checked").val()){ 　$("input:radio[name=c]:first").attr("checked" , "checked"); } …

  • チェックボックスに合わせてCSSを変更したい

    いつもお世話になっています。 現在jqueryの勉強をしながらWEBサイトを制作しています。 今回質問させていただきたいのはページを読み込んだ際に 前ページからチェックを引き継いでいる（phpで言うGET POST）チェックボックスに合わせてCSSを変更する方法です。 投稿時にカテゴリーをチェックボックスにより選択された内容によって 入力フォームの表示を変更しているのですが 次ページに飛ぶとチェックは残っているのですがCSSがリセットされてしまいます。 $(document).ready(function(){ if( $( 'input:checkbox[name="tax_input[tumblog][]"]:eq(0)' ).is( ':checked' ) ) { $("#1111").css({display:'none'}) } }); 読み込み時に先頭のチェックボックスに入力が入っていたら #1111にdisplay:noneをかけるつもりでしたがうまく動作しませんでした。 独学で学んできましたのでかなり初歩ができていない 状態で質問をしているかもしれませんが もしご指摘いただけましたら幸いでございます。 どうぞ宜しくお願い申し上げます。

  • 送信後のチェックボックスの表示

    最初の画面でAにチェックされているとします。 そのあとに、AとBをチェックしたあとにSubmitで送信します。 送信したあとに、AとBにチェックした最初の画面を表示させたいときは、 どんな風にすればよいのでしょうか。 今は・・・ If Request.Form="" <input type="checkbox" name="test" value="A" checked>A <input type="checkbox" name="test" value="B">B <input type="checkbox" name="test" value="C">C Else Select Request.Form("test") Case "A" <input type="checkbox" name="test" value="A" checked>A <input type="checkbox" name="test" value="B">B <input type="checkbox" name="test" value="C">C Case "B" <input type="checkbox" name="test" value="A">A <input type="checkbox" name="test" value="B" checked>B <input type="checkbox" name="test" value="C">C Case "C" <input type="checkbox" name="test" value="A">A <input type="checkbox" name="test" value="B">B <input type="checkbox" name="test" value="C" checked>C 　　・・・ End Select End If というように、全ての場合のときに"checke"をつけて表示させています。 もっと、効率のよい書き方はないものでしょうか？

  • チェックボックスのチェックについて

    submit時に一つでもチェックがなければアラートを表示 チェックがあれば進む・・・としたいです。 <form action=next.html name=form1> <input type=checkbox name=checkbox1 value=1> <input type=checkbox name=checkbox2 value=2> <input type=checkbox name=checkbox3 value=3> <input type=checkbox name=checkbox4 value=4> <input type=checkbox name=checkbox5 value=5> ～以下50まで続きます <input type=submit value=submit> </form> function countChecked(form1) { var total = 0; var max = 50; for (var index = 0; index < form1.checkbox.length; index++) { total += form1.checkbox[index].checked ? 1 : 0; } if(countChecked(document.form1)) > 0) { return true; } else { alert("no"); return false; } return(total); } 過去に似たような質問を参考に作ってみましたがダメでした。 チェックボックスの名前の付け方が悪いのでしょうか。

  • チェック出来る数を制限&チェックされない場合0

    【チェックボックスにチェック出来る数を制限しながら、チェックされない場合には0を入力する】ということが希望です。 それぞれを分離させた場合は、下記で可能でした。 この2つを同時に満たす方法が分かりません。 ご教授頂きたくお願いいたします。 【チェックボックスにチェック出来る数を制限する方法】 <SCRIPT language="JavaScript"> <!-- // チェックボックスに使用している名前 chn = new Array("ch1","ch2","ch3","ch4","ch5"); chc = 3; // チェックできる数 // チェックボックスにチェックできる数を制限する function chBx(cn){ cnt = 0; for(i=0; i<chn.length; i++) { if(document.form1.elements[chn[i]].checked) cnt++; } if(cnt > chc) { alert("チェックできる項目は" + chc + "個までです"); document.form1.elements[cn].checked = false; } } //--> </SCRIPT> <input type="checkbox" name="ch1" value="2" onClick="chBx('ch1')"> <label for="type1">1</label> <BR> <input type="checkbox" name="ch2" value="2" onClick="chBx('ch2')"> <label for="type1">2</label> <BR> <input type="checkbox" name="ch3" value="3" onClick="chBx('ch3')"> <label for="type1">3</label> <BR> <input type="checkbox" name="ch4" value="4" onClick="chBx('ch4')"> <label for="type1">4</label> <BR> <input type="checkbox" name="ch5" value="5" onClick="chBx('ch5')"> <label for="type1">5</label> <BR> 【チェックボックスがチェックされない場合に0を入力する】 　　<input type="hidden" name="ch1" value="0"> 　　<input type="checkbox" onclick="this.form.ch1.value=this.checked ? 1 : 0"> 　　<input type="hidden" name="ch2" value="0"> 　　<input type="checkbox" onclick="this.form.ch2.value=this.checked ? 1 : 0"> 　　<input type="hidden" name="ch3" value="0"> 　　<input type="checkbox" onclick="this.form.ch3.value=this.checked ? 1 : 0"> 　　<input type="hidden" name="ch4" value="0"> 　　<input type="checkbox" onclick="this.form.ch4.value=this.checked ? 1 : 0"> 　　<input type="hidden" name="ch5" value="0"> 　　<input type="checkbox" onclick="this.form.ch5.value=this.checked ? 1 : 0"> 上記を同時に満たしたいというのが今回の質問の趣旨です。

  • 特定のチェックボックスをチェックするには

    特定のチェックボックス「白」を CHECKEDにする方法を教えて下さい。 ＃数と位置が変動するので配列は取得できません。 ＃「もしもcolorの値が白なら CHECKED」のような関数にしたい。 <INPUT TYPE="CHECKBOX" NAME="color" VALUE="おまかせ"> <INPUT TYPE="CHECKBOX" NAME="color" VALUE="白"> <INPUT TYPE="CHECKBOX" NAME="color" VALUE="ピンク"> <INPUT TYPE="CHECKBOX" NAME="color" VALUE="緑">

  • 複数あるチェックボックスの入力チェックするには？

    チェックボックスの入力チェックスクリプトを探しており、下記のようなスクリプトをネット検索で見つけました。 <!-- <script type="text/javascript"> function chNull(msg,obj) { if(!obj) return true; if((obj.type || obj[0].type) == 'checkbox'){ var flag = 0; if(obj.length){ for(var i=0; i<obj.length; i++) { if(obj[i].checked) flag = 1; } } else { if(obj.checked) flag = 1; } if(flag == 0) { alert(msg + 'を選択してください。'); return false; } } return true; } --> </script> <form method="POST" action="■.cgi" onSubmit="return chNull('チェックボックス',a);"> <input type="checkbox" name="a" value="A1" />A1 <input type="checkbox" name="a" value="A2" />A2 </form> 同じnameのチェックボックス群がひとつしかないときはこれで問題ないのですが、 下記のようにnameが複数ある場合にはこのスクリプトのどの部分を変えればよいのでしょうか？ <input type="checkbox" name="a" value="A1" />A1 <input type="checkbox" name="a" value="A2" />A2 <input type="checkbox" name="b" value="B1" />B1 <input type="checkbox" name="b" value="B2" />B2 <input type="checkbox" name="c" value="C1" />C1 <input type="checkbox" name="c" value="C2" />C2 できればこのスクリプトをベースとして使用したいと思っています。どなたかお分かりの方がいらっしゃいましたらお教え下さいませ。 よろしくお願い致します。

  • jqueryについて

    ただいま、jqueryのtoggle()を使って、 チェックボックスのON/OFFでimgのclassを切り替える（imgをクリックしてチェックボックスをON/OFFもできる）ということを しているのですが、なぜか、チェックボックスをクリックしても、 ボタンの反応はしているのですが、チェック（黒い「レ」）が表示されません。 以下、jsです。 ※チェックボックスと画像の組み合わせは複数あります。 $(function(){ $("li.p01").toggle( function(){ $("input.c01").attr("checked","checked"); $("li.p01").attr("class","p01on"); }, function(){ $("input.check01").removeAttr("checked"); $("li.p01on").attr("class","p01"); } ); $("input.check01").toggle( function(){ $("li.p01").attr("class","p01on"); }, function(){ $("li.p01on").attr("class","p01"); } ); $("li.p02").toggle( function(){ $("input.check02").attr("checked","checked"); $("li.p02").attr("class","p02on"); }, function(){ $("input.check02").removeAttr("checked"); $("li.p02on").attr("class","p02"); } ); $("input.check02").toggle( function(){ $("li.p02").attr("class","p02on"); }, function(){ $("li.p02on").attr("class","p02"); } ); }); ご教授お願いいたします。 また、ボタンが10個あるのですが、 このまま、複製していくのもどうかと思うんですが、 もっと簡単にまとめる方法などあるのでしょうか。 ご回答よろしくお願いいたします。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する