動画サイトで「ストロボエッジ」主題歌の「愛唄～since 2007～」を聞くことにハマってます。

1分半くらいしかないのに、ひたすら繰り返し聞きながら作業してます☆

この曲、有村架純が歌ってると思ってたんですけど、どうやらwhiteeenって全く別人だったんですね。。。

とりあえず、この曲を10数回リピートしながら悩んでた問題がjQueryでのinputタグの操作です。

目的の動作は、複数のチェックボックスから特定の箱をチェックしたときだけ、別の選択肢が現れるって感じ。不動産サイトでありそうなやつです☆

とりあえず、最終的にうまく動いたのが下のコード。

ーーーーーーーーーーーーーーーーーーーーーーーーーーーー

function judge_check(){
    if($(‘#shisetsu1:checkbox’).prop(‘checked’) || $(‘#shisetsu2:checkbox’).prop(‘checked’)){
        $(‘#jokenBox’).css(‘display’,’block’);
    } else {
        $(‘#jokenBox’).css(‘display’,’none’);
    }
}

$(‘#shisetsu1:checkbox,#shisetsu2:checkbox’).on(‘click’,function(){
    judge_check();

})

ーーーーーーーーーーーーーーーーーーーーーーーーーーーー

関数やID名のセンスは自覚してますのでノータッチで。

動作は

・#shisetsu1と#shisetsu2はチェックボックスで、このどちらかにチェックが入っているときは#jokenBox(別の選択肢が入っているdivタグ)が表示される。

・どちらにもチェックが入ってない場合は#jokenBoxは非表示になるという感じです。

結論から言うと、propにしているところを最初はattrで操作していたのが問題だったようです。

■propとattrの違い

propはチェックの有無を「true」「false」

attrはチェックの有無を「checked」「undefined」

で返すようです。

attrで指定してたときは、チェックが入っているのに、チェック無しの動作をするから悩んでいましたが、返ってくる値に違いがあったようですね。

falseとundefinedの違いを認識しておく必要があるのかなと思いますが、とりあえずはinputタグを扱うときは、attrではなくpropで！と考えておけばいいかなと思います＾＾