javascript - 選択したラジオボタンの横にテキストボックスを表示する

Question

2 つのラジオ ボタン オプションを持つ 1 つのラジオ ボタン グループがあります。ラジオボタンがチェックされている場合、その横にテキストフィールドを表示させたいです。

これが私のフィドルです

jQuery と .css 関数を使用してみましたが、うまくいきません。選択したラジオ ボタンの横にあるテキスト フィールドに Web サイトの URL を入力できるようにしたいと考えています。最初のものを選択すると、その横にテキストボックスが表示されます。もう一方に切り替えると、テキスト ボックスが消えて、2 番目のラジオ ボタンの横に表示されます。

どんな助けでも大歓迎です。

どうもありがとう！

Answer 1

display次の代わりにプロパティを使用できますvisibility。

input[type=text] {
  display: none
}

$('input[type=radio]').change(function() {
   $('input[type=text]').hide()
   $(this).parent().next().show()
});

デモ

1. show()
2. hide()
3. next()
4. parent()

Answer 2

これはうまくいきます：

//hide both by default
$('#siteCourtier').hide();
$('#siteAgence').hide();

$('#courtierRadio').change(function() {
   if($('#courtierRadio').is(':checked'))
   {
       $('#siteCourtier').show();
       $('#siteAgence').hide();
   }
});

$('#agenceRadio').change(function() {
   if($('#agenceRadio').is(':checked'))
   {
       $('#siteAgence').show();
       $('#siteCourtier').hide();
   }
});