在所选单选按钮旁边显示一个文本框

Question

我有1个带有2个单选按钮选项的单选按钮组。 如果选中单选按钮，我想在其旁边显示一个文本字段。

这是我的fiddle

我尝试使用jQuery和.css函数，但它不起作用。 我希望人们能够在他们选择的单选按钮旁边的文本字段中输入他们的网站URL。如果我选择第一个，则会在其旁边显示一个文本框。如果我切换到另一个，文本框将消失并显示在第二个单选按钮旁边。

任何帮助都将不胜感激。

非常感谢！

Answer 1

您可以使用display属性代替visibility：

input[type=text] {
  display: none
}

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

DEMO

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();
   }
});