コーディング

ラジオボタンにチェックを入れた時だけ入力できるテキストボックス

  • このエントリーをはてなブックマークに追加
ラジオボタンにチェックを入れた時だけ入力できるテキストボックス

こんにちは、花粉が厄介すぎて空気清浄機が手放せません、制作の中村です。
目玉取り出して洗いたい(´・ω・`)
髪の毛全部剃りたい(´・ω・`)
この季節はひたすら引きこもりたくなりますね・・・

さて、今日は表題の通りラジオボタンによくある「その他」の選択肢とその下によくある「その他にチェックしたときだけここに理由を入力してください」のテキストボックスの切っても切れない関係。
その他にチェックした時しか入力できなくていいならあらかじめ入力できないようにしてた方が親切ってものだな・・・と思って先日付けたやつです。

まずhtml


input type=”text”の部分がその他の入力する部分です。
色々省略しすぎた感があるのでその他のテキストエリアにはプレースホルダー等は適宜お入れください。

そしてjs

お名前に「radioitem」が付いているものを監視しています。
選択された値を「radioval」という変数に入れていきまして
もし(if)radiovalに入った値が「その他」というテキスト(文字列)だったら
disabled属性(Attr)をremoveしてね!
そうじゃないなら(else)disabledしてね!ということで
違う値が入ったら再びdisabledされるという感じです。

サンプルはこちら

jQueryまったくもって苦手なのですがこれはすごいわかりやすかった(/・ω・)/

  • このエントリーをはてなブックマークに追加

【Webデザイナー募集!】D-Gripで一緒に働きませんか?

ただいま株式会社D-Gripシステムでは、制作部として一緒に働いてくれるWebデザイナーさんを募集しています。

実務経験がある方はもちろん、専門学校や独学で勉強された未経験の方でも歓迎です!
800サイト以上の運営実績のある会社で、プロのWEBデザイナーへの道を着実に歩んでいきませんか?

お問い合わせはコチラから↓
採用サイトへ

お電話はコチラから↓
TEL:03-5363-2191

採用サイトへ